inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

프론트엔드 개발자를 위한, 실전 웹 성능 최적화(feat. React) - Part. 1

1-11) 1강 요약 정리

크롬 다크모드와 웹 성능과의 관계

502

박굿뜨

작성한 질문수 25

1

사진과 같이 크롬 다크모드를 까면서 로딩되는 속도가 현저하게 느려졌는데 혹시 이러한 현상에대해 아시는지 여쭤봅니다.

react devtools

답변 1

5

유동균

안녕하세요 박굿뜨님,

다크모드에서의 속도 저하 현상에 대해 질문을 주셨는데요.

박굿뜨님께서 적용하신 다크모드가 정확히 어떤 설정(크롬 테마인지 flag 인지 등등)을 통해 적용한 것인지는 알 수 없으나 함수의 이름(darkness)을 봤을 때, 확실히 다크모드 설정의 영향인 것 같습니다.

해당 기능에서 다크모드를 적용하기 위해 서비스의 스타일을 조사하고 강제로 색을 변경하는 과정(어디까지지나 추측입니다)에서 메인쓰레드의 리소스를 사용하는 것 같습니다.

추가로 몇몇 크롬 확장 프로그램들은 스크립트가 삽입되어 메인 쓰레드에서 돌기 때문에 분석 환경에 영향을 줄 수 있습니다.

답변이 도움되었기를 바라며, 강의에 관심을 가져주셔서 감사합니다. 

bundle analyzer 에 대한 질문이 있습니다.

0

108

2

Cannot find module serve 에러

1

103

1

성능 탭에서 소요시간이 안보입니다

0

204

2

이미지 CDN 만드는 방법

0

459

1

Performance FPS 탭이 안보여요.

1

796

1

CPU throttling이 뭔가요?

0

1118

1

default export가 아닌 named export일 때 lazy사용법

1

1069

1

lazy적용하였는데 네트워크탭에 분리하여 보이지 않습니다

1

582

1

network 캐싱에 대해서 질문 있습니다!

1

425

1

vue project에서 chrome performance tab 확인하기

1

457

1

node version으로 인한 오류

4

1231

1

강의 자막

1

953

2

번들파일과 병목현상 질문

2

396

1

webpack-bundle-analyzer 질문

1

786

1

이미지 프리로딩 질문

1

385

1

이미지 최적화 활용

1

581

1

강력 새로고침

1

323

1

Suspense 관련해서 질문드립니다

2

360

1

config-overrides cant resolve path

1

362

1

이미지 preload 컴포넌트 preload 차이 질문드립니다.

1

611

1

custom react 환경에서 node_modules chunk 분리

1

380

1

removeSpeical 함수를 줄여야겠다고 하는 이유!

1

281

1

Factory pattern에 대해서 궁금한 점이 있습니다

2

364

2

텍스트 압축 방식에 대해 질문이 있습니다

2

950

1