#lighthouse

질문 2
해시태그 없이 키워드만 일치하는 질문은 개수에 포함되지 않아요.

2년 전 · 정종윤 님의 답변 업데이트

개발환경과 배포환경에서 lighthouse 점수 차이가 많이 나는 이유가 무엇인가요?

개발-50점대 배포-90점대 이렇게 성능에서 40점 정도가 차이나던데 배포하면 압축이 돼서 그런건지.. 정확히 어떤 이유 때문인지를 모르겠네요. 이유 아시는 분 계실까요?

개발자

#react

#frontend

답변 2

댓글 0

추천해요 1

조회 484

2년 전 · 이상선 님의 새로운 답변

Lighthouse를 이용한 성능 최적화 - 텍스트 압축 사용

안녕하세요. 개발한 웹 페이지를 lighthouse를 통해 성능 최적화에서 난관을 겪고 1년차 React 개발자입니다. lighthouse에서 추천 항목에 "텍스트 압축 사용"을 적용해보려 시도 중입니다. .htaccess 파일에 다음과 같은 코드를 넣어서 텍스트 압축을 실행하였습니다. <IfModule mod_deflate.c> AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/x-font-ttf AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE font/opentype font/ttf font/eot font/otf </IfModule> 결과적으로 네트워크 탭에서 Content-Encoding: gzip 으로 표시되는 것을 보니까, 텍스트 압축이 되는 것처럼 보입니다. 그런데 lighthouse에서는 성능 점수가 더 올라가지 않고 있습니다. 혹시 "텍스트 압축" 부분에서 최적화 하는 다른 방법이 있을까요? 아니면 제가 놓치고 있는 부분이 있는 걸까요?

개발자

#react

#lighthouse

#front-end

답변 1

댓글 0

조회 337

3달 전 · 동우 님의 새로운 답변

스타트업 프론트엔드 1년차 이직 고민

안녕하세요 스타트업에 다니고 있는 프론트엔드 1년차 개발자입니다 최대한 빨리 이직을 준비해서 가고 싶은데 방향성을 어떻게 잡아야 할 지 모르겠어서 조언을 구하고자 이렇게 글을 올립니다 프론트엔드가 회사에 저 혼자여서 사수 없이 회사에서 운영하는 서비스가 2개여서 2개의 웹사이트을 배포하여 서비스를 운영하고 있습니다. 제가 회사에 들어와서 웹사이트를 만들 때 사수도 없고 대표님도 개발에 대한 지식이 없으셔서 기획-디자인-개발까지 2-3달만에 만들라고 하시더라구요 (개발하고 배포까지 1-2달 걸렸습니다) 그래서 제가 비전공자이고 막 부트캠프를 졸업했어서 정말 기초적인 것들로 작업을 했습니다 (사용한 프론트 기술스택은 React, styled-components,recoil(atom만) 등을 썻구요
소셜로그인, 반응형 작업, lighthouse로 성능 최적화도 진행해보았습니다) 1. 프론트엔드 공고를 보면 nextjs,typescript,redux 혹은 react-query가 거의 필수적으로 들어가는 것 같은데 
이거를 다 완벽하게 배우고 적용시켜서 이력서에 적어내기에는
시간도 너무 오래걸릴 것 같고 코딩테스트나 cs면접 준비도 해야하는데 현실적으로 불가능할 것 같아서
 선택과 집중을 하고 싶은데 어떻게 준비를 해야할까요?
 nextjs,typescript,redux 혹은 react-query가 들어간 간단한 사이드 프로젝트를 하나 만들어서 이력서에 적어내면 될까요?
 2. 제가 만든 사이트를 이력서에 적어서 냈을 때 인사담당자 분들이 꼼꼼히 살펴보실까요? 그러면 리팩토링을 하는게 좋을까요? 3. 자세하게 좀 들여다보면 모든 부분에서 많이 부족한 것 같은데 이직을 해도 될까 싶습니다ㅠㅠ 
현재 제 실력에서 어떤 부분을 추가하거나 정리해보면 큰 장점이 될까요?
 4. 현재 포괄임금제 + 최저보다 적은 연봉(식대제외)을 받고 있는데 제 경력으로 이직할 때 연봉을 어느정도까지 부를 수 있을까요?
 구체적인 수치와 협상방법을 알려주실 수 있을까요? 주절주절 얘기가 많았네요 읽어주셔서 감사합니다 답변해주시면 정말 너무 감사드리겠습니다ㅠㅠ

개발자

#신입

#프론트엔드

#이직

#연봉

#react

답변 3

댓글 0

추천해요 2

조회 596

2년 전 · 커리어리 AI 봇 님의 새로운 답변

Webpack bundle 작업이 그냥 react client server에 영향을 미치는건가요?

현재 최적화를 경험해보고자 기존 react 프로젝트를 webpack 5와 함께 splitting 작업을 진행하고 있습니다. 여기서 드는 궁금증이 webpack dev server로 서버를 키지 않고 일반 react-scripts start 로 서버를 켜도 webpack으로 진행한 최적화 등이 반영이 되는걸까요? LightHouse로 확인했을 시에 bundle파일의 용량이 줄어있어서 점수가 10점가량 올라간 것을 확인했습니다. (참고로 react.lazy 또한 반영을 했습니다.)

개발자

#webpack

#react

#code-splitting

#최적화

#optimize

답변 2

댓글 1

조회 174

3년 전 · 배민근 님의 답변 업데이트

Lighthouse 모바일 페이지 점수가 너무 낮게 나오는데 해결 방법이 있나요 ?

NextJS 로 구현한 사이트의 라이트하우스 점수를 측정 했는데 모바일 페이지 점수가 너무 낮게 나와요. 특정 페이지만 그런게 아니고 전체적으로 모바일 페이지만 20-30 점 낮게 나오네요. 혹시 모바일은 원래 기본 점수가 낮나요 ? 아니면 제가 모르는 설정이 있는걸까요 ?

개발자

#lighthouse

#라이트하우스

답변 1

댓글 1

조회 594