프론트앤드 개발을 하다보면 화면전환이 느리다거나 기타 에니메이션에서 느리게 동작한다고 클라이언트 쪽에서 이슈를 제기하는 경우가 있다 . 이때 조금이라도 빠르게 최적화 시킬 수 있는 방법이 있을까..? 크롬의 경우 개발자 도구에 들어가게 되면 기본 옵션 이외에 추가적인 설정으로 Layer옵션을 볼 수 있다. Layer에 들어가면 각 영역에 잡아놓은 섹션의 모양을 전개도처럼 확인할 수 있는데 원하는 영역을 클릭하게 되면 해당 섹션에서 잡아먹고 있는 메모리를 눈으로 확인 할 수 있다.!!! 화면에 안보이니까,, 라며 너무 과도하게 큰 이미지를 사용하고 있다면 딱 필요한 만큼만 사용하게끔 줄여도 메모리가 확 주는것을 눈으로 직접 확인하면서 작업할 수 있다! IOS의 경우 레티나를 사용하기 때문에 일반 모니터에서..
리액트는 무엇인가? “컴포넌트”라는 개념에 집중이 되어있는 라이브러리 데이터를 넣으면 우리가 지정한 유저 인터페이스를 조립해서 보여 준다. 생태계가 넓고, 사용하는 곳도 많다. 개발자가 원하는 스택을 맘대로 골라서 사용 할 수 있다. DOM기반으로 작동하는 페이지는 그때 그때 새로 뷰를 만들어버리라고 하면 성능적으로 엄청난 문제가 있을 것이다. 그래서 사용하는게 Virtual DOM *Virtual DOM이란? 변화가 일어나면, 실제 브라우저의 DOM에 새로운걸 넣는것이 아니라, 자바스크립트로 이뤄진 가상 DOM에 한번 렌더링을 하고, 기존의 DOM과 비교를 해서 변화가 필요한 곳에만 업데이트를 해줌. DOM 변화를 최소화 시켜주는 역할을 한다. (Vue에서도 사용한다.) 리액트 설치 및 사용 설치 np..
VueJS 2.0 스택오버플로우 질문 수 3379개 VueJS = 프론트엔드 자바스크립트 프레임워크 매우 작고 가벼움 시작하기 쉬움 다른 라이브러리와 프레임워크와 혼용하기 쉬움 메뉴얼이 타 프레임워크 / 라이브러리에 비해 한글화가 잘되어있음 Vue 와 react의 공통점 가상DOM을 사용한다. 컴포넌트를 제공한다. 뷰에만 집중을 하고 있고, 라우터, 상태관리를 위해 써드파티 라이브러리를 사용한다. *라우터란? *써드파티 라이브러리란? vue와 react의 성능차이 모든 시나리오에서 vue가 react보다 우수한 성능을 발휘 컴포넌트의 종속성이 렌더링 중 자동으로 추적되어 시스템에서 다시 렌더링 해야하는 컴포넌트를 정확히 알고 있다. 최적화 되지 않았거나, 최적화 되었을때도 vue가 react보다 빠르다...
경기도 성남시 분당구에 위치한 NAVER 그린팩토리에서 TECH CONCERT : FRONTEND 가 열렸어요. 프론트앤드 개발자가 되고 싶은 분들, 이미 프론트앤드 개발에 종사하고 계신분들 다양한 참가자들이 모여 진행된 이번 개발포럼 ! 프로그램 진행은 아래와 같아요. 플랫폼이란? 복수의 그룹이 참여하고 얻고자하는 가치를 교환할 수 있는 환경을 가진 서비스 플랫폼을 고려하지 않은 UI 개발을 했을 경우 - 커스텀 및 확장을 고려하지 않았기 때문에 추후 발생하는 서비스의 요구사항을 수용하기 어려움. - 플랫폼의 css와 서비스의 css간섭이 발생하고 스타일의 우선순위 관리가 어려움. - UI 요소간의 관계를 파악하기 어려워 버그 및 사이드 이펙트 발생. 플랫폼 UI 설계는 무엇이 중요할까? - 구조를 먼..