GIT

git : Linux 커널 소스를 관리하기 위해 리누스 토발즈가 직접 개발한 분산형 버전관리 도구.
분산형이라는 의미는 여러 클라이언트들이 각자의 컴퓨터에 저장소를 반들어 중앙 서버의 전체 사본을 가지고 작업하는 것임.

SVN과 차이점

  1. SVN

    • 중앙 서버에서 소스코드와 히스토리를 관리함
  2. GIT

    • 소스를 여거 개발 PC와 저장소에 분산해서 저장
    • 로컬에서 버젼을 관리하기 때문에 SVN에 비해 빠름

GIT의 장점

  1. 같은 파일을 여러 명이 동시 작업하는 병렬 개발 가능
    (브랜치를 통해 개발한 뒤, merge 하는 방식으로 개발 진행 가능)
  2. 분산 관리이기 때문에 중앙저장소에 문제가 생겨도 원상복구 가능

Git 기본 용어

  • repository : 저장소를 의미함
    저장소를 통해 소스, 히스토리, 태그의 관리가 가능하며, 저장소를 통해 작업자가 변경한 소스의 히스토리 확인 가능
  • working tree : 저장소의 어느 한 시점을 바라보는 작업자의 현재 시점
  • staging area : 저장소에 커밋하기 전에 커밋을 준비하는 위치
  • commit : 현재 변경된 작업 상태에서 점검이 끝나면 확정하고 저장소에 저장하는 작업
  • head : 현재 작업중인 branch를 가리킴
  • branch : 가지 또는 분기점
    작업을 할 때 원본을 복사해서 branch에서 작업을 한 후 완전할 때 merge하여 작업함
  • merge : 다른 branch의 내용을 현재 branch로 가져와 병합하는 작업.

git 주요 명령어

ropository 생성

  • git init : 깃 저장소 초기화
  • git clone {url} : 원격 저장소 복사

상태 확인

  • git status : 작업 디렉토리에 변경된 파일 확인하기
  • git diff : 변경된 파일들의 변경된 내용 확인
  • git log : 변경 이력 보기

브랜치 작업

  • git branch : 로컬 브랜치 목록 확인

  • git branch -r : 원격 브랜치 목록 확인하기

  • git branch -av : 로컬과 원격 브랜치 목록 확인하기

  • git branch -m {old_name} {new_name} : 브랜치 이름 변경하기

  • git branch {new_branch_name} : 브랜치 생성

  • git checkout {branch_name} : 브랜치 변경하기

  • git branch -d {branch_name} : 브랜치 삭제

반영

  • git add . : 모든 변경사항을 커밋 준비 "스냅샷"
  • git add {file} : 특정 파일의 변경사항을 커밋 준비
  • git commit -m '{message}' : 메세지와 함께 커밋하기
  • git commit --ammend : 마지막 커밋 메세지 수정하기 (push한 commit에는 하지 말것)

취소

  • git reset --hard HEAD^ : 이전 commit 취소, 변경사항 폐기
  • git reset --soft HEAD^ : 이전 commit 취소, 변경사항 유지
  • git reset --soft merge : merge 취소하기
  • git reset --hard HEAD && git pull : 변경사항 폐기 후 원격 저장소의 최신 코드로 덮어쓰기
  • git revert {commit_code} : 커밋 되돌리기

동기화 하기

  • git fetch {remote} : 원격 저장소의 최신사항 가져오기
  • git pull {remote} {branch} : 원격 저장소의 최신사항을 가져와서 병합하기
  • git pull --rebase : 원격 저장소의 변경사항을 가져오고 초기화 하기
  • git push : 원격 저장소에 변경사항 발행하기
  • git merbe {branch} : 브랜치 병합하기
  • git rebase {branch} : 리베이스 하기

브랜치의 변경사항 임시저장

  • git stash : 임시로 변경사항 저장하기
  • git stash pop : 임시 변경사항 불러오기
  • git stash list : 임시 변경사항 보기

계정

  • git global user.name "user_name" : git 계정 name 저장/수정
  • git global user.email "user_email" : git 계정 email 저장/수정
728x90
반응형

구글에서 제공하는 웹페이지 품질 개선을 위항 오픈 소스 자동화 툴.
성능, 접근성, 권장사항, SEO, PWA 에 대한 검사 가능.

중요 측정 항목

  • FCP (First Contentful Paint)
    • 페이지 로드가 시작된 시점부터 페이지 콘텐츠의 일부가 화면에 렌더링되는 시점까지의 시간 측정.
    • 1.8초 이하 권장
    • FCP
  • LCP (Lagest Contentful Paint)
    • 페이지가 로드되기 시작한 시점부터 가장 큰 텍스트 믈록 또는 이미지 요소가 화면에 렌더링되는 시점 까지의 시간 측정.
    • 2.5초 이하 권장
    • LCP
  • INP (Interaction to Next Paint)
    • 페이지에서 이루어지는 모든 탭, 클릭, 키보드 상호작용의 지연 시간.
    • 상소작용 수를 기반으로 페이지의 최악 상호작용 지연시간을 페이지의 전반적인 응답성으로 판단.
    • INP
  • TBT (Total Blocking Time)
    • 사용자가 화면에서 페이지를 이용(상호작용)할 수 있기 전까지 브라우져가 상호작용을 차단하는 시간.
    • 50 ms 권장
    • TBT
  • CLS (Cumulative Layout Shift)
    • 레이아웃 변경 횟수.
    • 콘텐츠 로딩으로 인해 사용자가 읽던 위치를 잃거나 잘못된 링크 또는 버튼을 클릭하게 되는 레이아웃의 변경 횟수.
    • 0.1 점 이하 권장
    • CLS
  • TTFB (Time to First Byte)
    • 리소스 요청과 응답의 첫 번째 바이트가 도달하는 시작점간의 시간의 측정도.
    • TTFB

결과 요약 항목

  • Performance : 웹페이지의 로딩 속도와 같은 성능 측정.
  • Accessibility : 접근성 지표 (버튼 간의 간격이나 글 폰트 싸이즈 등)
  • Best Practices : 권장 사항을 따라 개발되었는지 확인.
  • SEO (Search Engine Optimization) : 검색엔진 최적화 지표.
  • PWA (Progressive Web App) : 웹과 네이티브 앱의 기능 모두 이점을 가지도록 만들어진 서비스인지 확인.
728x90
반응형

'WEB > CLIENT_SIDE' 카테고리의 다른 글

[FE] 이벤트 버블링 (Event Bubbling)  (0) 2023.07.14
Webpack과 Babel 그리고 Polyfill  (0) 2020.11.30
 

아이젠하워 매트릭스

  • 업무의 우선순위를 먼저 해야 할 일, 계획해야 할 일, 위임할 일, 하지 않아도 될 일 4단계로 분류

업무 우선순위

  1. 자신의 업무를 모두 나열
  2. 각 업무의 긴급성과 중요도 판단
  3. 업무를 4개의 카테고리로 분류
    1. 긴급하고 중요한 일 - 먼저 해야할 일
    2. 긴급하지 않지만 중요한 일 - 계획해야 할 일
    3. 긴급하지 않지만, 중요하지 않은 일 - 위임할 일
    4. 긴급하지도, 중요하지 않은 일 - 하지 않아도 될 일
  4. 아이젠하워 매트릭스에 따라 우선순위 확인하고, 일정 계획

아이젠하워 매트릭스

 

아이젠하워 매트릭스

  1. 중요하고 급한 일 - 먼저 한다
    명확한 결과가 따르며 장기 목표에도 영향을 주는 업무로서, 가장 먼저 해야 하는 업무입니다.
    이 카테고리 안의 업무들은 미루지 않고 바로 처리하는 것이 좋습니다.
  2. 중요하지만 급하지 않은 일 - 계획한다
    장기 목표에 영향을 미치지만 당장 처리하지 않아도 되는 일입니다.
    긴급하지 않기 때문에 신중하게 준비하고 계획하여 완성도를 높일 수 있습니다.
    중요하고 급한 일을 해결한 뒤 이 카테고리 안의 업무를 처리합니다.
    이 업무들을 마냥 미뤄두지는 않도록 주의해야 하며, 집중력을 발휘하여 수행할 수 있도록 합니다.
  3. 중요하지 않지만 급한 일 - 위임한다
    바로 처리되어야 하지만 장기 목표에는 영향을 미치지 않는 업무입니다.
    이러한 업무는 에너지 소모가 많지만 특별한 기술은 요하지 않는 잔업인 경우가 많습니다.
    꼭 본인이 직접 하지 않아도 되는 일이기 때문에, 다른 사람에게 위임하거나 대체 시스템을 마련하도록 합니다.
  4. 중요하지도 급하지도 않은 일 - 하지 않는다
    목표를 달성하는 데 방해가 되는 일입니다.
    업무 목록에서 삭제하도록 합니다.

긴급한 일과 중요한 일을 구별하는 법

  • 긴급한 일
    • 즉시 해야 하는 일로, 기한 안에 처리하지 못하면 명확한 결과가 나타납니다.
      • 예) 기한이 임박한일, 장애, 긴급 지시사항, CS 이슈 등
  • 중요한 일
    • 당장 하지 않아도 되지만, 장기적인 목표에 도움이 되는 일입니다.
      • 예) 신 기능 스터디, 프로젝트 계획, 3rd Party 솔루션 도입

참고자료

https://1891ghaon.tistory.com/117

 


업무의 우선순위 7단계

  1. 모든 업무가 포함된 하나의 작업 목록을 만들기
    1. 효과적으로 우선순위 정하는 첫 단계는 업무의 전체 범위를 파악하는 것부터 시작합니다.
    2. 모든 업무가 기록되면 각 업무의 중요성, 긴급성, 소요 시간, 보상을 적습니다.
  2. 중요한 사항 식별하기 : 진정한 목표 이해하기
    1. 우선순위를 정하는 일은 즉각적인 '시간 관리 전략'처럼 보일 수 있지만 장기적인 '목표 달성 전략'이기도 합니다.
    2. 설정된 목표(큰 그림)를 위해 자신이 어떤 일을 하고 있는지 이해해야 미래 결과와 가장 관련이 있는 업무파악할 수 있습니다.
    3. 최종 목표에 영향을 주지 않는 작업으로 하루를 채우는 것은 시간 낭비입니다.
      항상 목표를 염두해 두고 있어야 합니다.
  3. 긴급한 사항을 강조 표시하기
    • 할 일 목록에서 마감일이 눈에 띄도록 하면 신속하게 완료해야 하는 작업을 알 수 있습니다.
    • 공식적으로 필요하지 않은 경우에도 마감일을 설정해야 합니다. 그렇지 않으면 중요한 작업을 계속 미루게 될 것입니다.
  4. 중요성 긴급성을 바탕으로 우선순위를 정한다.(아이젠하워 매트릭스)
    • 중요하고 긴급한 일 : 먼저 수행합니다.
    • 중요하지만 긴급하지 않은 일 : 전략적 계획을 세우고 완료일을 정합니다.
    • 긴급하지만 중요하지 않은 일 : 일을 축소하거나 권한을 위임합니다.
    • 긴급하지도 중요하지도 않은 일 : 할 일 목록에서 삭제합니다.
  5. 우선순위가 겹치는 것은 피한다
  6. 한 번에 하나의 중요한 작업에 집중해야 합니다.
    여러 가지의 우선 순위를 계속 시도하고 관리하는 것은 성과 저하로 이어집니다.
  7. 시간과 노력을 고려한다
  8. 할 일 목록이 너무 많아 부담스럽다면 최소한의 시간과 노력이 드는 작업에 우선순위를 두고 신속하게 진행하세요.
    작업을 정리하면 여유와 함께 작업을 추진할 수 있는 성취감이 생깁니다.
  9. 끊임없이 검토하고 현실을 반영해라
  10. 업무 목록과 우선순위자주 검토하는 것이 '통제력 및 집중력 유지'에 중요합니다.

 

참고자료

 

 
728x90
반응형
 

인터넷 속도를 측정하기 위해서 fast.com등 여러 사이트를 이용한다.

맥 터미널에서 명령어 하나로 간단하게 인터넷 속도를 측정할 수 있다.

networkQuality

 
728x90
반응형

'OS > MacOS' 카테고리의 다른 글

맥(mac)에서 텍스트 파일 인코딩 변경하기  (0) 2024.01.15

윈도우를 사용하는 분들과 협업을 하다보면 윈도우에서 작성된 텍스트 파일이 UTF-8이 아닌 MS-949 (CP-949) 인코딩으로 작성된 파일을 받을 때가 있다. 국제 표준인 UTF-8을 이용해 주시면 감사하겠지만, 어쩔 수 없이 내가 인코딩을 변경 해 줘야 한다.

CP-949에서 UTF-8로 인코딩을 변경하는 것은 터미널에서 간단하게 처리 할 수 있다.

iconv -c -f {원본 인코딩} -t {변환 인코딩} {원본 파일} > {저장 파일}

 
 
728x90
반응형

'OS > MacOS' 카테고리의 다른 글

mac(맥)에서 인터넷 속도 측정하기  (0) 2024.01.15
728x90
반응형

건강관리

솔직히 자신 있게 운동을 많이 했다고는 할 수 없다.
날이 좋을 때는 일주일에 4회까지도 러닝을 나갔으나, 야외에서 하는 러닝의 특성상 눈/비가 오면 못 나가고, 겨울이 되고 추워지니 또 나가기가 쉽지 않다.
건강을 위해 헬스장을 다니는 것이 좋겠지만, 그러자니 너무 진부하기도 하고 운동기구 차례를 기다리느라 시간 낭비하는 것을 별로 좋아하지 않다보니...
그렇지만 24년에는 23년보다 더 건강을 챙기는 해가 되어야 한다.

여행과 문화생활

2022년에는 분기에 2회 이상 전시회를 다녔으나, 올해는 그 정도로 전시를 많이 다니지는 않았다.
그렇지만 해외 뮤지션들의 굵직한 내한 공연을 3회 다녀왔으니 아무래도 작년보다 더 문화생활을 즐겼다고 생각한다.

그리고 미뤄뒀던 국내 여행도 이번 달에 여수를 다녀왔고 맛있는 것도 많이 먹고 왔다.

나름 청춘을 잘 즐겼다고 자신할 수 있지만, 그만큼 이직이나 공부에 신경 쓰지 않을 건가 싶은 생각도 들기도 하고... 뭐든지 트레이드 오프기 때문에 후회는 없다.
2024년에도 문화생활을 놓치지 않고 꾸준히 하겠다.

Bruno MarsEdward Hopper

 

 

소비 패턴에 대한 성찰

올해 저축을 많이 못 했다. 회사에서 번 돈을 회사에 잔뜩 써버렸다.
아무래도 담당 중인 업무가 쇼핑몰 서비스 운영이기도 하고, 마케팅에 당했다고 해야 하나 아니면 직원 할인의 늪에 빠져버렸다고 해야 하나.
아무튼 옷을 너무 많이 샀다.

경제가 어렵다고 그 경제를 내가 살리는 미친 짓은 그만둬야 한다.

생활을 이루는 필수 3요소는 의식주인데, 그중에 의가 직원할인이라는 이유로 비교적 저렴하게 양질의 상품을 얻을 수 있다 보니 자꾸 지르게 되는 것도 있는 것 같다. 사실 회사 옷을 입다가 저렴한 보세 상품을 보면 확실히 질이 떨어지는 게 눈에 보인다. 그리고 주변 직원들이 아무리 후줄근하게 입고 출근해도 잘 꾸미고 오는 것을 보면 남루하게 출근하는 날에는 뭔가 의기소침해지는 나를 보기도 한다.

그래도 어쩌겠는가? 옷의 질을 올리다 내 노년에 삶의 질이 낮아질 수 있음을 경계해야 한다.

개그맨 박영진 그랬다 "사장님이 미쳤어요"에서 사장님은 멀쩡하고 "미친 건 나"라고. 90% 할인은 내가 물건을 구매할 확률이 90%라는 것.
24년에는 소비를 경계하고 저축을 가까이하겠다..

연애

나 연애한다.


이직? 어쩌면 보다 많은 면접 경험

블로그의 목적이 일하면서 얻게 된 지식과 이직에 대한 기록이니 이직 준비 과정에서 얻은 경험을 정리한다.

2023년은 월평균 1.5회의 면접을 봤고 이 경험으로 얻은 것이 은근히 많다. 떨어진 곳도 많고 처우 협상에서 엎어지거나 최종 합격했지만, 내가 거절한 곳도 있다. 그럼 이런 과정에서 얻은 것이 무엇이냐?

상반기에는 이력서 점검을 주력으로 했다. 서류 지원을 100건 이상, 그 중 코테는 10회, 코테에서 면접으로 이어진 것은 3건으로 코테 성적이 별로 좋지 않다. (어쩌면 코테 후 서류 검토라서 서류에서 떨어졌을 수 있다는 생각도 하고 있다.) 서류 100건 중 60건은 개선해 나간 이력서에 대한 검증이라고 생각한다.
물론 이력서에 기업에서 원하는 기술 스펙이 없어서 떨어진 것도 있고, 혹은 학력에서 걸러졌을 수도 있다고 생각한다.
아무튼 이력서를 지금으로써는 나름 잘 정리했다고 생각한다.
부족한 건 역시나 나의 기초지식면접 스킬, 해당 기업에서 원하는 기술 스택, 면접과 시험을 응시하는 내 실력이라는 결론이다.

20개 조금 안 되는 회사에 면접을 봤는데, 기술 면접에서 말아 먹은 곳이 많았다. 내가 한 일들 기반으로 쓴 이력서이지만 그 안에서 실제로 내가 알지 못한 기술적인 것들이 많았다. 기초 지식이 부족한 것에 대해서는 개략적으로 정리를 했지만, 블로그에 남기진 않았다.
그래서 24년 상반기 목표 중 하나는 이력서에 적은 프로젝트에 대한 디테일한 정리도 포함된다.

처우 협상에서 엎어진 곳도 8곳이나 된다. 나는 내 연봉이 높은 편이라고 생각 못 했는데, 생각보다 연차치고는 많이 받는 편이었나 보다. 지금 연봉보다 깎으려는 곳이 나 동결하려는 곳도 더러 있었다.

붙은 곳도 있지만 가지 않은 곳도 있다. 많은 경험은 아니지만 경험적으로 1차 면접에서 기술 질문보다는 컬쳐핏, 인성 질문 위주로 사람을 뽑는 회사는 그만한 이유가 있다고 생각한다. 기술적 도전과 성장보다는 지원 부서로써의 역할이 큰 것 같더라. 혹은 사람을 뽑은 경험이 많지 않아 어떤 질문을 해야 하는지 모르는 것일 수도 있다. 어쩌면 편견일 수 있다.

아무튼 기술, 컬쳐핏, 인성 세 가지 질문이 균형 있게 확인하는 면접관들이 뭔가 그 회사에 대한 신뢰가 더 생긴다고 해야 하나. 면접을 보고 붙는 것도 쉽지 않지만, 면접을 보면서 그 회사로 이직할 것인가 말 것인가 결정하는 것 또한 쉽지 않다.

8월부터 매달 꾸준히 원티드 프리온보딩 특강을 듣는데, 그중 한 연사가 한 말이 기억에 많이 남는다.

  • 회사를 본인 기준으로 아래와 같이 3개 등급으로 나눈다.
    1. 면접을 본다면 100% 붙을 회사. (만만한 회사)
    2. 지금 다니는 곳과 비슷해서 붙어도 안 갈 가능성이 높은 회사.
    3. 가고 싶은 회사
  • 나눈 기준에서 1, 2단계의 회사에 면접 경험을 많이 쌓는다.
  • 면접 과정에서 기술 질문, 컬쳐핏 질문, 인성 질문에 대한 대답 스킬을 쌓는다.
    • 1, 2 단계의 회사에서 의외로 고전할 수도 있다.
  • 3단계의 회사로 이직 한다.

상반기에 가고 싶은 회사의 면접을 말아먹고 느낀 것이, 사람에게 기회는 오지만 그 기회를 잡을 준비가 되어있지 않으면 원하는 것을 얻을 수 없다고 생각했다. 그리고 연사의 이 말을 듣고 내가 원하는 기회를 잡기 위해 여기저기 면접을 많이 보는 노력이 허투루 하는 것은 아니라고 생각했다.

그리고 면접을 많이 보다 보니 확실히 나중에 내가 사람을 뽑을 땐 어떤 질문을 해야 할까도 생각해 보게 된다.

24년에도 2023년 만큼 면접을 보는게 목표다.

공부

면접을 준비해서, 혹은 나의 역량 강화를 위해 공부를 열심히 하긴 했으나, 해도 해도 모자란 게 공부다.
이게 참 어려운 게 다기망양이라는 것. CS, 코테, 사용해 보지 않은 기술, 지금껏 사용했지만, 더 깊게 공부해야 하는 Java와 Spring, 시스템의 근간인 DB와 Infra, Architect 8가지 항목을 적절히 분배해서 공부해야 하는데, 그게 참 어렵다...

24년 공부 계획은 좀 다시 세워봐야겠다.

일단 구매한 인프런 인강부터 다 봐야지...


Merry Crisis and a Happy New Fear

즐거운 위기와 행복한 새로운 두려움이 문장은 2008년 그리스 금융위기 당시에 시위대가 썼던 문장이라고 한다.

다른 배경은 뒤로 하고 나는 이 문구가 새로운 앞날에 대한 모험과 도전을 이야기하는 것 같아서 좋다.

위기를 즐기고, 새로움에 대한 두려움을 행복하게 즐긴다. 그리고 그 안에서 크게 성장하길...

 

 
 
728x90
반응형

'커리어 디버깅' 카테고리의 다른 글

[회고] 2023년 상반기  (0) 2023.07.02
[면접 회고] 20230530 COY 면접 회고  (0) 2023.05.30
[면접 회고] 20230420 EI사 1차  (0) 2023.04.20
[면접 회고] W사  (0) 2023.02.27
[면접 회고] C사  (0) 2023.02.27

캐시 설계 전략

  Caching은 H/W, S/W 전반에 걸쳐 사용되는 기술이다.
  DB - application 뿐 아니라 클라이언트나 CDN에서도 캐싱을 사용한다.
  이 글에서는 DB - Web Application의 캐싱만 다룬다.

서비스 응답시간에 큰 영향을 미치는 부분은 주로 네트워크 통신과 DB I/O이다. 캐싱을 통하면 DB I/O로 인해 발생하는 오버헤드를 줄일 수 있다.

서론

Caching?

캐시는 빠른 응답과 비용 절약을 위해 사용하는 임시 데이터다.

  • 클라이언트의 요청으로 특정 데이터가 필요한 경우 서버는 DB에 질의한 뒤 결과를 반환한다.
  • 만약 요청하는 데이터의 캐시가 존재한다면 DB에 질의하지 않고 캐시로부터 데이터가 반환된다.
  • 캐기사 없다면? DB에 질의가 수행되어 반횐되고 그 결과를 캐싱한다.

캐시의 관리

캐시는 임시 데이터다. 따라서 캐시를 저장할 때 캐시가 만료되는 시간 (expire time || TTL; Time To Live)를 명시한다.
캐시는 해당 시간 내에서만 유효하고 만료 시간이 경과하면 사용할 수 없다.

캐시에 만료되는 시간을 두는 이유는 캐시가 실시간 데이터가 아니기 때문이다. 만약 원본 데이터가 바뀐다면 캐시된 내용도 바뀌어야 한다.

캐시를 사용하는 이유

캐시를 사용하면 DB에서 데이터를 읽을 때 발생하는 I/O 오버헤드를 줄일 수 있다. 캐시는 보통 Redis와 같은 In-Memory DB를 사용한다.
In-Memory DB는 메모리를 사용하기 때문에 일반적인 RDBMS보다 데이터를 읽는 속도가 빠르다. 따라서 캐시는 DB에서 데이터를 읽는 것 보다 월등히 속도가 빠르다.

모든 데이터를 캐싱하는 건?

In-Memory DB를 사용하면 요청을 빠르게 처리할 수 있지만, 메모리 특성상 데이터 소실의 위험이 있다. 또한 메모리 사용은 비용이 발생하기 때문에 방대한 양의 데이터를 모두 메모리에 적재하는 것은 큰 비용이 든다.

캐시 설계 전략이 필요한 이유

따라서 데이터의 특성에 따라 DB와 캐시를 적절히 사용하는 것이 매우 중요하다. 캐싱 전략을 올바르게 수립하면 적은 비용으로 큰 퍼포먼스 향상을 기대할 수 있다.


What to Cache

어떤 데이터를 캐싱하는 것이 좋을지 생각해 보아야 한다. 캐싱하기 좋은 데이터의 특성은 다음과 같다.

  1. 자주 바뀌지 않는 데이터
  2. 자주 사용되는 데이터
  3. 자주 같은 결과를 반환하는 데이터
  4. 오래 걸리는 연산의 결과

자주 바뀌지 않는 데이터

자주 바뀌지 않는 데이터의 경우, 한 번 캐시로 저장하면 메모리에서 읽어 빠르게 사용가능하다.
원본 데이터가 바뀌면 캐시도 바뀌어야 한다. 자주 바뀌지 않는 데이터의 캐시는 오랫동안 사용이 가능하기 때문에 캐싱하는 것이 효율적이다.

자주 사용되는 데이터

자주 사용되는 데이터는 캐싱하기 좋다. 한 번 캐싱해 놓으면 캐시를 사용하여 다수의 요청을 효율적으로 처리할 수 있다.
다만, 자주 사용될 지라도 매번 결과 값이 다르면 오히려 캐싱하지 않는 것이 낫다. 만약 일정시간 동안 데이터가 변하지 않는 것이 보장되면 해당 시간만큼의 TTL로 짧은 캐시를 생성하면 된다.
예를 들어 검색처럼 새로 요청하더라도 일정 시간 동안 같은 결과가 반환되는 경우에 해당한다.

자주 같은 결과를 반환하는 데이터

자주 같은 결과를 반환하는 데이터의 경우도 캐싱을 적용하기 좋다. 예를 들어 특정 arguments의 조합에 따라 결과가 일정한 경우 해당된다.
이런 경우는 각 arguments의 조합을 key로 연산 결과를 캐싱하면 된다.

오래 걸리는 연산의 결과

무거운 연산이 반복적으로 계산되어야 한다면 연산의 특성에 맞게 결과를 캐시하는 것이 효율적이다.
또는 사전에 별도의 프로세스에서 작업을 수행하여 결과를 미리 캐싱해 놓을 수 있다.

이 밖에도 일반적인 쿼리나 연산보다 캐싱할 때의 비용이 더 적다면 캐싱을 사용할 수 있다.
로그 분석이나 프로파일링을 통해 캐시를 적용할 함수나 API를 찾을 수 있다. 그러나 모든 사항을 고려하여 캐싱을 적용할지, TTL은 얼마나 적용할지 등은 개발자의 선택이 중요하다.


캐싱 전략 패턴의 종류

캐시를 이용하게 되면 닥쳐오는 문제점이 바로 데이터 정합성의 문제이다. 같은 종류의 데이터라도 두 저장소에 저장된 값이 서로 다른 현상이 일어날 수 밖에 없는 것이다.
따라서 적절한 캐시 읽기 전략(Read Cache Strategy)과 캐시 쓰기 전략(Write Cache Strategy)를 통해, 캐시와 DB간의 데이터 불일치 문제를 극복하면서도 빠른 성능을 잃지 않게 하기위해 연구를 할 필요가 있다.

캐시 읽기 전략 (Read Cache Strategy)

Look Aside Pattern

  • Cache Aside 패턴이라고도 불림.
  • 데이터를 찾을 때 우선 캐시에 저장된 데이터가 있는지 우선 확인, 캐시에 데이터가 없으면 DB에서 조회함.
  • 반복적인 읽기가 많은 호출에 적합.
  • 캐시와 DB가 분리되어 가용되기 때문에 원하는 데이터만 별도로 구성하여 캐시에 저장.
  • 캐시와 DB가 분리되기 때문에 캐시 장애 대비 구성이 되어 있음.
    만일 Cache Store가 다운되더라도 DB에서 데이터를 가져올 수 있어 서비스 자체는 문제가 없음.
  • 대신 Cache Store에 붙어있던 connection이 많았다면, Cache Store가 다운된 순간 DB로 몰려 부하발생 가능.

일반적으로 사용되는 기본적인 캐시 전략. 이 방식은 캐시에 장애가 발생하더라도 DB에 질의를 실행함으로 캐시 장애로 인한 서비스 문제는 대비할 수 있지만, Cache Store와 DB간 정합성 유지 문제가 발생할 수 있음.
반복적으로 동일 쿼리를 수행하는 서비스에 적합, 단건 호출 빈도가 높은 서비스에는 비적합.
이런 경우 DB에서 캐시로 데이터를 미리 넣어주는 작업을 하기도 하는데 이를 Cache Warming이라고 함.

Read Through 패턴

  • 캐시에서만 데이터를 읽어오는 전략 (inline cache)
  • Look Aside와 비슷하지만 데이터 동기화를 라이브러리 또는 캐시 제공자에게 위임하는 방식이라는 차이가 있음.
  • 따라서 데이터를 조회하는데 전체적으로 속도가 느림.
  • 또한 데이터 조회를 전적으로 캐시에만 의지하므로 Cache Store가 다운될 경우 서비스 이용에 차질이 생길수 있음.
  • 캐시와 DB간의 데이터 동기화가 항상 이루어져 데이터 정합성 문제에서 벗어날 수 있음.
  • 읽기가 많은 호출에 적합

Cache Aside 방식과 비슷하지만, Cache Store에 저장하는 주체가 Server인가 혹은 Data Store 자체인가의 차이가 있음.
직접적인 DB 접근을 최소화 하고, Read에 대한 소모되는 자원을 최소화할 수 있음.
하지만 캐시에 문제가 발생하는 경우 바로 서비스 중단이 되기 때문에 Cache Store의 Replication 또는 Cluster구성하여 가용성을 높여야 함.

캐시 쓰기 전략 (Write Cache Strategy)

Write Back 패턴

  • Write Behinde 패턴이라고도 불림.
  • 캐시와 DB 동기화를 비동기하기 때문에 동기화 과정이 생략.
  • 데이터를 저장할 때 DB에 바로 질의하지 않고, 캐시에 모아서 일정 주기 배치 작업을 통해 DB에 반영.
  • 캐시에 모아놨다 DB에 쓰기 때문에 쓰기 커넥션 회수 비용과 부하를 줄일 수 있음.
  • Write가 빈번하면 서 Read를 하는데 많은 양의 리소스가 소모되는 서비스에 적합.
  • 데이터 정합성 확보.
  • 자주 사용되지 않는 불필요할 리소스 저장.
  • 캐시에서 오류발생시 데이터 영구소실의 가능성.

데이터를 저장할 때 DB가 아닌 캐시에 먼저 저장하여 모아놓았다가 특정 시점마다 DB로 쓰는 방식으로 일종의 Queue 역할을 겸하게 됨.
캐시에 데이터를 모았다 한 번에 DB에 저장하기 때문에 DB 쓰기 횟수 비용과 부하를 줄일 수 있지만, 데이터를 옮기기 전에 캐시 장애가 발생하면 데이터 유실이 발생할 수 있다는 단점이 존재.
반대로 DB에 장애가 발생하더라고 지속적인 서비스 제공을 보장하기도 함.
Replication이나 Cluster 구조를 적용하면 Cache Store 서비스의 가용성을 높일 수 있고, Read Through와 결함하변 가장 최근에 업데이트 된 데이터를 항상 캐시에서 사용할 수 있음.

Write Through 패턴

  • DB와 Cache에 동시에 데이터를 저장하는 전략.
  • 데이터를 저장할 때 먼저 캐시에 저장한 다음 DB에 저장.
  • Read Trough와 마찬가지로 DB 동기화 작업을 캐시에 위임.
  • DB와 캐시가 항상 동기화 되어 있어, 캐시의 데이터는 항상 최신 상태로 유지.
  • 캐시와 백업 저장소에 업데이트를 같이 하여 데이터 일관성 유지.
  • 데이터 유실이 발생하면 안 되는 상황에 적합.
  • 자주 사용되지 않는 불필요한 리소스 저장.
  • 매 요청마다 두번의 Write 가 발생함으로 빈번한 생성, 수정이 발생하는 서비스에서는 성능 이슈 발생.
  • 기억장치 속도가 느릴 경우, 데이터를 기록할 때 CPU가 대기하는 시간이 필요하기 때문에 성능 감소.

Cache Store와 DB에 동시에 반영하는 방식. 항상 동기화 되어 있고 항상 최신정보를 가지고 있다는 장접이 있음.
저장할 때마다 2개 과정을 거치기 때문에 상대적으로 느림.

Write Around 패턴

  • 모든 데이터는 DB에 저장
  • Cache Miss가 발생하는 경우에만 DB와 캐시에 데이터 저장
  • DB와 Cache Store의 데이터가 다를 수 있음.

Cache Miss가 발생하기 전에 DB에 저장된 데이터가 수정되었을 때, 사용자가 조회하는 Cache Store와 DB 간의 데이터 불일치 발생.


Cache 읽기 + 쓰기 전략 조합

  • Look Aside + Write Around
  • Read Through + Write Around
  • Read Through + Write Through

캐시 저장시 참고

  • Cache Hit Ratio : 캐시 사용의 정중도. 적중율이 높을 수록 CPU와 주기억장치 속도 차이로 인한 병목현상을 최소화할 수 있다.
    자주 사용되면서 자주 변경되지 않는 데이터를 캐시에 저장할 경우 높은 성능 향상을 이뤄낼 수 있다.
  • 지역성 (Locality) : Cache Hit Ratio는 캐시의 Locality, 즉 지역성에 의해 높아진다. 지역성이란 데이터 접근이 시간적 혹은 공간적으로 가깝게 일어나는 것을 의미함.
    • 시간적 지역성 : 최근에 엑세스 된 프로그램이나 데이터가 가까운 미래에 다시 엑세스 될 가능성이 높은을 의미.
    • 공간적 지역성 : 기억장치 내에 인접하여 저장된 데이터들이 연속적으로 엑세스 될 가능성이 높음을 의미.
    • 순차적 지역성 : 분기가 발생하지 않는 이상 명령어들이 기억장치에 저장된 수서대로 인출되어 실행됨을 의미
  • 일반적으로 캐시는 메모리에 저장되는 형태를 선호한다.
  • 메모리 저장소(Cache Store)는 대표적으로 Redis와 MemCached가 있으며, 메모리를 1차 저장소로 사용하기 때문에 디스크와 달리 제약적인 저장 공간을 사용한다.
  • 자주 사용되는 데이터를 어떻게 뽑아 캐시에 저장하고 자주 사용되지 않는 데이터는 어떻게 제거해 갈것이냐를 지속적으로 고민해야 할 필요성이 있다.
  • 캐시는 자주 사용되며 자주 변경되지 않는 데이터를 기준으로 하는 것이 좋다.
  • 캐시는 휘발성을 기본으로 하기 때문에 어느 정도 데이터 수집과 저장 주기를 가지도록 설계해야 한다.
  • 유실 또는 정합성이 일부 깨질 수 있다는 점을 항상 고려해야 한다.
  • 레파토 법칙 (8:2 법칙)
    전체 결과의 80%가 전체 원인의 20%에서 일어나는 현상을 가리킨다.
    80%의 활동을 20%의 유저가 하기 때문에 20%의 데이터만 캐시해도 서비스 대부분의 데이터를 커버할 수 있다는 의미다.

캐시 제거시 참고

  • 캐시는 기본적으로 영구 저장소에 저장된 데이터의 복사본으로 동작하는 경우가 많다.
  • 데이터 동기화 작업이 반드시 필요하다는 의미로 개발시 고려해야 한다.
  • 캐시 만료 정책이 제대로 구현되지 않은 경우 클라이언트는 데이터가 변경되었음에도 오래된 정보가 캐싱되어 오래된 정보를 사용할 수 있다는 문제점이 있다.
  • 따라서 캐시 구성시 기본 만료정책을 설정해야 한다.
  • 만료 주기가 너무 짧으면 데이터는 너무 짤리 제거되고 캐시의 이점이 줄어든다.
  • 만료 주기가 너무 길면 데이터 변경의 가능성과 메모리 부족현상, 자주 사용해야 하는 데이터가 제거되는 등의 역효과를 나타낼 수 있다.

Cache Stampede 현상

  • TTL 값이 너무 작게 설정될 경우 발생할 수 있는 현상이다.
  • Cache Miss로 DB에 데이터를 요청한 뒤, 다시 Cache Store에 저장하는 과정을 거칠 경우 모든 application에서 DB에서 값을 찾는 duplicate read가 발생한다.
  • 읽어온 값을 각각 Cache Store에 저장하는 duplicate write도 발생하여 처리량도 다 같이 느려질 뿐 아니라 불필요한 작업이 굉장히 늘어나 폭주장애로 이어질 가능성이 있다.

캐시 공유시 참고

  • 캐시는 application의 여러 인스턴스에서 공유하도록 설계한다.
  • 각 application의 인스턴스가 캐시에서 데이터를 읽고 수정할 수 있다.
  • 캐시 업데이트 방식
    1. 캐시 데이터의 변경 직전에 데이터가 검색된 후 변경되지 않았는지 확인해야 한다.
      변경되지 않았다면 업데이트하고 변경되었다면 업데이트 여부를 어플리케이션 레벨에서 결정할 수 있어야 한다.
    2. 캐시 데이터를 업데이트 하기 전에 Lock을 잡는 방식.
      lock을 사용할 경우 조회성 업무를 처리하는 서비스에 Lock으로 인해 대기현상이 발생할 수 있다.

캐시 가용성 참고

캐시를 구성하는 목적은 빠른 성능 확보와 데이터 전달에 있으며 데이터의 영속성 보장하기 위함은 아니다.
데이터의 영속성은 기존 RDBMS에 위임하고, 캐시는 데이터 읽기에 집중하는 것이 성능확보의 지침사항이다.
또한 Cache Store가 장애로 인해 다운 되었을 경우나 서비스가 불가능 할 경우에도 지속적인 서비스가 가능해야 한다. 이는 데이터가 결국 RDBMS에 동일하게 저장되고 유지된다는 점을 뒷바침 한다.

728x90
반응형

참고 페이지의 간소화 버전이다. 아주 조금의 신경을 쓰면 명확하게 전달되는 커밋 메세지를 작성할 수 있다.

commit message 구조

  <타입>[적용 범위(선택 사항)]: <설명>

  [본문(선택 사항)]

  [꼬리말(선택 사항)]

1. 타입

  • commit 이 무엇애 대한 작업인지 키워드를 통해 인지
    • fix: - 버그 수정
    • feat: - 새로운 기능 추가, 기존 기능 변경
    • build: - 빌드 관련 수정
    • ci: - CI 관련 수정
    • docs: - 문서(주석) 수정
    • style: 코드 스타일, 포멧팅 수정
    • refactor: - 코드 리팩토링 (기능 수정 아님. )
    • test: - 테스트 코드 추가, 수정
    • chore: 기타 변경사항 수정 (.gitignore 등)

2. 설명

  • 커밋 메시지 제목
    • 제목은 50자를 넘기지 않고, 마침표를 붙이지 않기
    • 제목에 커밋 타입을 함께 작성
    • 과거 시제를 사용하지 않고 명령조로 작성
    • 제목과 본문은 한 줄 띄워 분리
    • 제목의 첫 글자는 반드시 대문자로
    • 이슈에 관련된 내용이라면 이슈 번호를 붙히기

3. 본문

  • 자세한 설명

4. 꼬릿말

  • 이슈 번호 등

참고 : https://www.conventionalcommits.org/ko/v1.0.0/#%ea%b0%9c%ec%9a%94

728x90
반응형

'VCS' 카테고리의 다른 글

[GIT]  (0) 2024.04.10
[GIT] 브랜치, 커밋 간 다른 파일 목록 조회  (0) 2022.04.05
[GIT] remote branch 가져오기  (0) 2022.04.05
[TortoiseSVN] Disconnect 방법  (0) 2021.09.10
[GIT] 윈도우에 Git 설치하기  (0) 2020.01.26

이벤트 버블링

아래 코드의 이벤트는 div에 할당되어 있지만, em이나 code 같은 자식 태그를 클릭해도 동작합니다.

  <div onclick="console.log('click div');">
    <em><code>EM</code></em>을 클릭했는데도, <code>div</code>에 할당된 핸들러가 동작합니다.</em>
  </div>

버블링

한 요소에 이벤트가 발생하면, 이 요소에 할당된 핸들러가 동작하고, 이어서 부모 요소의 핸들러가 동작합니다.
가장 최상단의 조상 요소를 만날 때까지 이 과정이 반복되면서 요소 각각에 할당된 핸들러가 동작합니다.

3개의 요소가 FORM > DIV > P 형태로 중첩된 구조에 각각 핸들러가 할당되어 있습니다.

  <form onclick="console.log('click form')">
    FORM
    <div onclick="console.log('click div')">
      DIV
      <br/>
      <p onclick="console.log(p)">P</p>
    </div>
  </form>

가장 안쪽의 p를 클릭하면 순서대로 다음과 같은 일이 벌어집니다.

  1. p에 할당된 onclick 핸들러 동작.
  2. div에 할당된 onclick 핸들러 동작.
  3. form에 할당된 onclick 핸들러 동작.
  4. document 객체를 만날 때까지, 각 요소에 할당된 onclick 핸들러 동작.

이런 동작 방식 때문에 p 요소를 클릭하면 p -> div -> form 순서로 3개의 콘솔 로그가 출력되는 것이조.
이런 흐름을 '이벤트 버블링'이라고 부릅니다.
이벤트가 제일 깊은 곳에 있는 요소에서 시작해 부모 요소를 거슬러 올라가며 발생하는 형세 입니다.

거의 모든 이벤트는 버블링 됩니다.
focus와 같이 버블링 되지 않는 이벤트도 있습니다.

event.target

부모 요소의 핸들러는 이벤트가 정확히 어디서 발생했는지 등에 대한 자세한 정보를 얻을 수 있습니다.
이벤트가 발생한 가장 안쪽의 요소는 타깃(target) 요소라고 불리고, event.target을 사용해 접근할 수 있습니다.
event.target과 this (event.currentTarget)은 다음과 같은 차이가 있습니다.

  • event.target은 실제 이벤트가 시작된 '타켓'요소 입니다. 버블링이 진행되어도 변하지 않습니다.
  • this 는 현재 요소로, 현재 실행중인 핸들러가 할당된 요소를 참조합니다.

버블링 중단하기

이벤트 버블링은 타깃 이벤트에서 시작해서 html 요소를 거쳐 document 객체를 만날 때까지 각 노드에서 모두 발생합니다.
몇몇 이벤트는 window 객체까지 거슬러 올라가기도 합니다. 이 때도 모든 핸들러가 호출됩니다.

핸들러에게 이벤트를 완전히 처리하고 난 후 버블링을 중단하도록 할 수 있습니다.
event.stopPropagation()을 사용하면됩니다.

event.stopImmediatePropagation()

한 요소의 특정 이벤트를 처리하는 핸들러가 여러개인 상황에서, 핸들러 중 하나가 버블링을 멈추더라도 나머지 핸들러는 여전히 동작합니다.
event.stopPropagation()은 위쪽으로 일어나는 버블링은 막아주지만, 다른 핸들러들이 동작하는 건 막지 못합니다.
버블링을 멈추고, 요소에 할당된 다른 핸들러의 동작도 막으려면 event.stopImmediatePropagation()을 사용해야 합니다. 이 메소드를 사용하면 요소에 할당된 특정 이벤트를 처리하는 핸들러들이 모두 동작하지 않습니다.

꼭 필요한 경우를 제외하곤 버블링을 막지 마세요

버블링은 유용합니다. 버블링을 꼭 멈춰야 하는 명백한 상황이 아니면 버블링을 막지 마세요. 아키텍쳐를 잘 고려해서 진짜 막아야 하는 상황에서만 버블링을 막으세요.
event.stopPropagation()은 추후에 문제가 될 수 있는 상황을 만들어 낼 수 있습니다.

  • 예시 시나리오
    1. 중쳡 메뉴를 만들었다 가정합니다. 각 서브메뉴에 해당하는 요소에서 클릭이벤트를 처리하도록 하고, 상위 메뉴의 클릭 이벤트 핸들러는 동작하지 않도록 stopPropagation을 적용합니다.
    2. 사람들이 페이지에서 어디를 클릭했는지 등의 행동 패턴을 분석하기 위해, window내에서 발생하는 클릭 이벤트 전부를 감지하기로 결정합니다. 일부 분석 시스템은 그렇게 분석합니다. 이런 분석 시스템의 코드는 클릭이벤트를 감지하기 위해 document.addEventListener('click', ...)을 사용합니다.
    3. stopPropagation으로 버블링을 막아놓은 영역에선 분석 시스템의 코드가 동작하지 않기 때문에 분석이 제대로 되지 않습니다. 안타깝게도 stopPropagation을 사용한 영역은 죽은 영역(dead zone)이 되어버립니다.

이벤트 버블링을 막아야 하는 경우는 거의 없습니다.
버블링을 막아야 해결 되는 문제라면 커스텀 이벤트 등을 사용해 문제를 해결할 수 있습니다.
핸들러의 event 객체에 데이터를 저장해 다른 핸들러에서 읽을 수 있게 하면, 아래쪽에서 무슨 일이 일어나는지를 부모 요소의 핸들러에게 전달할 수 있으므로, 이 방법으로도 이벤트 버블링을 통제할 수 있습니다.

 


참고 : https://ko.javascript.info/bubbling-and-capturing

728x90
반응형

'WEB > CLIENT_SIDE' 카테고리의 다른 글

[성능 측정] Google Lighthouse  (0) 2024.04.01
Webpack과 Babel 그리고 Polyfill  (0) 2020.11.30

+ Recent posts