본문 바로가기

전체 글19

typescript vscode lint 세팅 보호되어 있는 글 입니다. 2021. 3. 29.
재조정 (Reconciliation) 출처원본: ko.reactjs.org/docs/reconciliation.html 재조정 (Reconciliation) – React A JavaScript library for building user interfaces ko.reactjs.org 배열의 요소들을 렌더링하다가 성능이 저하되고, 원하지 않는 동작들이 발생할 때가 생겨서 공식문서를 다시 훑어보다가 좀 더 정확히 알아야 되겠다 싶은 개념이라 글을 작성하기로 했다. React는 선언적 API 를 제공하기 때문에 갱신이 될 때마다 매번 무엇이 바뀌었는지 걱정할 필요가 없다. 이는 애플리케이션 개발을 쉽게 만들어주지만, React 내부에서 어떤일이 일어나고 있는지 명확히 보이지 않는다. React의 비교(diffing) 알고리즘을 만들 때 어떤 .. 2020. 10. 29.
브라우저 의 렌더링 과정 렌더링이란 HTML, CSS, JavaScript 등의 개발자가 작성한 문서를 브라우저에서 그래픽 형태로 출력하는 과정을 뜻한다. 프론트엔드 개발을 할 때 브라우저의 렌더링 과정을 정확하게 이해하고 있으면, 어떻게 개발을 해야 좋은 성능을 내는지, 성능 최적화를 어떻게 해야하는지를 정확하게 판단할 수 있어야 한다. 브라우저 별 렌더링 엔진 브라우저는 렌더링을 할 때, 렌더링 엔진을 사용한다. 파이어폭스: 게코(Gecko) 사파리: 웹킷(Webkit) 크롬: 웹킷을 사용하다가 Fork 하여 블링크(Blink) 엔진을 자체적으로 구현하여 사용 렌더링 순서 1. HTML 파싱 후, DOM 트리 구축 (Document Object Model) 2. CSS 파싱 후, CSSOM 트리 구축 (CSS Object M.. 2020. 10. 29.
Reactjs + express + webpack4 github.com/lkm36486938/react-express-webpack4 lkm36486938/react-express-webpack4 Contribute to lkm36486938/react-express-webpack4 development by creating an account on GitHub. github.com 순수 개발환경 1. CRA 로 리액트 앱 만들기 2. npm i 로 모듈들 설치 npm i -D express html-webpack-plugin nodemon webpack webpack-cli webpack-dev-middleware webpack-dev-server webpack-hot-middleware webpack-merge babel-loader @babel/co.. 2020. 9. 23.
wsl ubuntu (18.04 LTS) 노드js 및 vscode 세팅 1. wsl, nvm, vscode 다운로드 --------------wsl 설치-------------- -- 우분투 쉘 다운로드 -- 1. 마이크로소프트 스토어 ubuntu 18.04 LTS 다운 -- 패키지 업데이트 -- 2. sudo apt-get update -- nvm 다운로드 -- 3. curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.2/install.sh | bash 3.5 nvm 설정 export NVM_DIR="$HOME/.nvm" [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" [ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_complet.. 2020. 9. 15.
when use Node.js ? 언제 Node.js 를 사용하면 좋을 지 알아보기 ... 전에 특징을 먼저 살펴봐야한다. 1. 구글 V8 자바스크립트 엔진 사용 2. 고성능 네트워크 서버 3. 단일쓰레드 이벤트루프 기반 4. 비동기 I/O 처리 (Non-Blocking I/O) 5. 개발 생산성 높음 정도의 특징을 가지고 있으며, Good Bad 1. 간단한 로직의 서비스 2. 대용량의 request 처리가 필요한 서비스 3. 빠른 응답시간을 요구하는 서비스 4. 비동기 방식에 어울리는 서비스 (ex. 채팅, 네트워크 스트리밍, ...) 5. 빠른 개발이 요구될 때 1. CPU 를 많이 잡아먹는 거대한 로직이 필요한 서비스 (노드는 싱글쓰레드임) 2. 서버 체크로직이 많은 서비스 (callback hell 에 빠질 수 있음) 위의 3번.. 2020. 9. 15.
반응형