본문 바로가기
반응형

전체 글59

브라우저 렌더링 과정, 그만 검색하고 외우자 (feat.MDN) 웹 성능 성능에 관련한 요인 지연시간 브라우저는 대부분 single thread로 동작하는 것 지연시간 빠른 Load를 위해서는 빠르게 요청하는 것도 중요하다. 네트워크 지연시간을 줄여서 리소스를 빠르게 요청하고, 웹 최적화를 통해 페이지 로드를 빠르게 한다. 네트워크 지연시간 네트워크를 통해 컴퓨터로 바이트를 전송하는데 걸리는 시간 웹 최적화 페이지 로드가 최대한 빠르게 이루어지도록 하는 것 브라우저는 single thread 유저는 브라우저 내에서 수많은 상호작용을 시도하고, 브라우저는 이에 맞게 반응을 제공해야 한다. main thread가 요청된 작업을 수행하며 유저의 상호작용에 반응하기 위해서는 렌더링 시간이 중요하다. 브라우저가 singel thread인 것을 미뤄보아 main thread에 .. 2024. 4. 15.
Web font를 subset으로 만들기(feat. python) font tools 커맨드라인 인터페이스로 제공되는 파이썬 라이브러리이다. 폰트 툴즈는 다양한 폰트 조작 기능을 제공하고 있으며, 그 중 폰트 subsetting을 지원하는 도구가 pyftsubset 이다. 설치 python 2.7, 3.4 이후 버전에서 지원한다. $ python --version // 버전 체크 그리고 pip 명령어를 사용해야하기 때문에 pip 설치가 필요하다. mac에서는 기본적으로 python2.7이 설치되어 있고, python3.x을 사용하고 싶다면 pip가 아닌 pip3로 사용해야 한다. 현재 내 컴퓨터는 pyhton3.x이 설치되어 있기 때문에 pip3으로 명령어를 실행했다. $ pip3 install fonttools pyftsubset 설치를 확인한다. $ pyftsubs.. 2024. 4. 15.
엄격하게 commit 하기 (husky, commitlint, lint-staged) Conventional Commit commit 메시지의 규칙 모두 같은 규칙을 사용하며 커밋의 변경 및 수정사항, 기능 구현 등을 명시적으로 표현할 수 있다 커밋을 통한 히스토리도 파악할 수 있다 conventional commit 문서에서 커밋 규칙을 더 자세하게 알 수 있다 husky convential commit을 따르기 위해 node.js 패키지 중 하나인 husky를 사용해 git hooks를 관리할 수 있다 방법 1. husky 설치 npm install --save-dev husky 2. husky 초기화(추천) ./husky/pre-commit을 생성하고, package.json에 prepare 명령어를 추가한다 npx husky init 3. lint-staged 설치 linting .. 2024. 4. 15.
nvm을 이용해서 프로젝트 별 node 버전 통일 시키기 nvm? Node.js version manager 의미 그대로 node version을 관리하기 쉽게 제공되는 패키지이다 대표적으로 아래의 명령어가 있다 현재 버전을 포함한 사용가능한 node 목록 $ nvm ls 특정 버전을 설치 $ nvm install {20} 가장 최신 안정화 버전을 설치 $ nvm install --lts 우리가 원하는 것은 버전 통일 javascript는 버전 의존성이 강한 특징을 가지고 있다 프로젝트 별로 버전이 달라서 node 버전을 문서로 관리하고 있다면 아래의 방법이 매우 도움이 될 것이다 .nvmrc nvm 설정 파일 .nvmrc에 해당 프로젝트 버전을 명시한다 명령어를 통해 프로젝트 node 버전으로 변경한다 방법 최상위에 .nvmrc 생성(mac) $ touch .. 2024. 4. 15.
728x90
반응형

티스토리툴바