profile
FrontEnd Developer
post-thumbnail

최신 브라우저 렌더링 살펴보기를 통해 본 적용 기술 deep dive

유저 트래픽이 증가함에 따라 프론트엔드 개발자가 개선 할 수 있는 방법으론 브라우저 렌더링 과정을 파악하고 그 중 단축시킬 수 있는 요소 파악이나 과정을 개선시켜 좀 더 나은 유저 경험을 제공 할 수 있다. 그 여러 최적화 기술 중 도입한 기술을 뜯어보고 어느 부분에

2023년 3월 9일
·
0개의 댓글
·
post-thumbnail

Github action을 이용해 배포자동화(in AWS)

배포 자동화를 도입한 이유는 3가지이다.1\. 효율성 : 배포를 위한 매번 같은 프로세스를 줄이자2\. 일관성: 프로젝트를 누가 변경했는지에 관계없이 모든 코드 변경이 동일한 방식으로 테스트되고 배포되도록 하자. 이는 최종 빌드에서 휴먼에러 및 환경변수의 리스크를 줄여

2023년 2월 28일
·
0개의 댓글
·
post-thumbnail

가상돔(VirtualDOM) deep dive

가상돔 원리... 복잡해 보이는데? >SPA 웹 기술에 근간 가상돔 근데 이거 어떻게 만들었지? 그냥.. 갑자기 궁금해졌다. 가상돔 만들 생각은 왜 했으며(why, how), 어느 단계에서 가상돔을 메모리에 올리는지. diff 알고리즘은 구체적으로 어떻게 걸러내는건지

2023년 2월 16일
·
0개의 댓글
·
post-thumbnail

웹뷰 최적화 만점을 위한 노력 -2-(IntersectionObserver, Token provider, Prefetch, font, Lcp, Lighthouse)

개선 후 개선 전 > 만점에 가까운 라이트 하우스 점수 쨖쨖 👏 어니언은 앱 서비스이지만, 웹의 장점이 필요한 페이지는 vue를 이용하여 웹으로 구성되어 있다. 그렇기에 앱에서 웹뷰 페이지를 로드할 경우 이질감 없이 로드하여 서비스를 제공하여야 하기 때문에

2022년 12월 9일
·
4개의 댓글
·
post-thumbnail

cleancode - 네이밍

주니어 필수 완독 도서 클린코드에 대해 아라보자정말 중요한 네이밍.. 내가 만든 코드인데도 일주일만 지나면 기억이 흐릿하다.어? 이 함수가 왜 필요했지? 라는 말을 해봤다면 포함이다.실제로 내가 만든 코드이다.xlsxData는 뭔지, 어디서 가져온건지 copyData에

2022년 6월 19일
·
0개의 댓글
·
post-thumbnail

clean code - 클린코드의 필요성

주니어 필수 완독 도서 클린코드를 아라보자프로그래머라면 누구나 유지 보수와 재사용성을 강조한다. 애자일 문화가 트랜드로 떠오르고 SPA방식이 발전하면서 그것의 중요성은 더욱 커졌다. 개발을 스터디 하면서 매번 강조를 받았겠지만, 유지 보수와 재사용성의 범위라는건 주관

2022년 6월 19일
·
0개의 댓글
·
post-thumbnail

프론트엔드 실무에서만 느낄 수 있는 극악 무도한 버그들

아직도 해결 못한 버그들이나, 버그가 발생 이유에 대해 명확하게 이해하지 못한 부분도 있습니다. 혹시나 알고 계신 선배 개발자분이 계시다면 알려주세요😂나는 평소 개발을 하다 버그를 마주치게 되면 최대한 구글링을 통해 해결하고자 한다. 버그의 원인을 파악하고 내가 여태

2022년 2월 20일
·
0개의 댓글
·
post-thumbnail

1년차 기념 VUE3 정리

벌써 1년차가 되었읍니다.. 정신없이 보냈지만 그 사이에 세상은 빠르게 변했고, 내 vue2 코드는 레거시 코드....로 변모 중 입니다. vue3가 기본 버전으로 채택 되면서 vue2 -> vue3에 달라진 점을 간략하게 정리해보겠습니다. 고작 1년차 개발자이지만 기

2022년 2월 15일
·
0개의 댓글
·
post-thumbnail

IBM - Javascript의 메모리 누수 패턴과 핸들링 방법(Memory leak patterns in JS)

본 글은 IBM developer article을 보고 작성한 글 입니다\[참고]사실 이 아티클을 처음 읽어본지는 꽤 오래전인데, 아티클이 작성한지 오래되기도 했고(2007년) 내용중 그렇다 할 획기적인 핸들링 방법 또한 없어서 읽고 넘겼던 아티클이다. 어쩌다 메모리

2021년 11월 13일
·
1개의 댓글
·
post-thumbnail

웹뷰 애니메이션 최적화 하기(FPS, Css hack, Throttle)

요즘 정말 바쁜 3개월을 보냈다. 신규 서비스 개발이 시작되어 우리 개발팀은 각자의 롤을 맡아 본격적으로 개발을 하느라 여름이 어떻게 지나갔는지 모를 정도로 개발에 매진했다.요번 신규 서비스 어니언은 앱을 베이스로 주린이를 위한 주식 앱 프로젝트로 기술 스택은 Flut

2021년 10월 26일
·
1개의 댓글
·
post-thumbnail

Redis 제대로 사용하기 (feat. 우아한세미나)

회사에서 사용하고 있는 기술 스택 중 하나인 redis에 대해 알아보자 Redis 왜 쓰는건데? Redis는 굵직 굵직한 기업들은 모두 사용중이거나 한번쯤은 도입을 생각해 봤을 정도로 너무나도 유명한 인메모리 데이터베이스(?)다. 쿠팡에서도 레디스를 사용중 인데

2021년 4월 23일
·
0개의 댓글
·
post-thumbnail

TECH CONCERT - 빠르게 훑어보는 웹 개발 트랜드를 보고

https://search.pstatic.net/common/?src=http%3A%2F%2Fblogfiles.naver.net%2FMjAyMDA5MDNfNDgg%2FMDAxNTk5MTE3NjYzNDcx.GhSZk4tQcvCL4sHgp_19ugII7WOYQxS

2021년 3월 10일
·
0개의 댓글
·
post-thumbnail

Core Javascript - 프로토타입

이 글은 Core Javascript를 읽고 내용을 정리하였습니다. 2회독 하였지만 잘못된 내용의 지적을 감사히 받겠습니다.자바스크립트는 프로토타입기반의 언어이다. 프로토타입의 정의와 작동원리를 제대로 이해하지 못한채 자바스크립트를 학습한다면 반쪽짜리 JS개발자다라고

2021년 3월 2일
·
0개의 댓글
·
post-thumbnail

Core Javascript - 클로저

이 글은 Core Javascript를 읽고 내용을 정리하였습니다. 2회독 하였지만 잘못된 내용의 지적을 감사히 받겠습니다.클로저는 여러 함수형 프로그래밍 언어에서 등장하는 보편적인 특성이다. 자바스크립트의 고유의 개념이 아니라서 ECMAScript 명세에서도 클로저의

2021년 2월 24일
·
0개의 댓글
·
post-thumbnail

Typescript를 쓰는 이유

사람들이 하도 TS를 사용해야 된다. 라고 강조하길래 TS를 쓰는 이유에 대해 정리를 해봤다.결국엔 JS라고 표현했지만 결과론 적으로 보면 TS은 JS의 상위 확장이다. Javascript + Type = TypeScript 자바스크립트에 타입에 대한 내용을 확장시킨

2021년 2월 20일
·
0개의 댓글
·
post-thumbnail

Core Javascript - 콜백함수

이 글은 Core Javascript를 읽고 내용을 정리하였습니다. 2회독 하였지만 잘못된 내용의 지적을 감사히 받겠습니다.콜백함수에 대해 코어적으로 접근해 보자!콜백 함수는 다른 코드의 인자로 넘겨주는 함수 이다. 콜백 함수를 넘겨받은 코드는 이 콜백 함수를 필요에

2021년 2월 19일
·
0개의 댓글
·
post-thumbnail

Core Javascript - this

이 글은 Core Javascript를 읽고 내용을 정리하였습니다. 2회독 하였지만 잘못된 내용의 지적을 감사히 받겠습니다.자바스크립트에서 가장 혼란스러운 개념의 this를 정리해야겠다.this가 가장 혼란스러운 이유는 상황에 따라 바라보는 this의 대상이 달라지기

2021년 2월 17일
·
0개의 댓글
·
post-thumbnail

Core Javascript - 실행 컨텍스트

이 글은 Core Javascript를 읽고 내용을 정리하였습니다. 2회독 하였지만 잘못된 내용의 지적을 감사히 받겠습니다.실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체로 자바스크립트 동작 언어로서의 성격을 가장 잘 파악할 수 있는 개념이다. 자바스

2021년 2월 16일
·
0개의 댓글
·
post-thumbnail

Core Javascript - undefiend vs null / 동등연산자 vs 일치연산자

이 글은 Core Javascript를 읽고 내용을 정리하였습니다. 2회독 하였지만 잘못된 내용의 지적을 감사히 받겠습니다.

2021년 2월 16일
·
0개의 댓글
·