Lighthouse 성능 개선 미세 먼지 TIP

# 01 개요

Lighthouse 성능 개선하고 계시는데, 점수가 왜 인지 안 오르시는 분들 있으시죠?

 

• 기본 스레드 작업 최소화하기
• [aria-*] 속성이 역할과 일치하지 않음
• <frame> 또는 <iframe> 요소에 제목이 없음

 

특히 상단과 같은 메시지가 나오고 있으시죠? 

 

오래 신경 쓰지 말고 바로 확인해 보세요!
(직접 테스트해보실 수 있도록 링크 남겨둘게요!)

 

 

https://lottomaker.co.kr/ (해결 전 페이지)

해결 전 해결 후 (https://lottomaker.co.kr)

https://lottomaker.co.kr/homenoad (해결 후 페이지)

해결 후 (https://lottomaker.co.kr/homenoad)

 

# 02 확인 사항

혹시 구글 광고, 네이버나, 구글 애널리틱스 또는 외부에서 불러오는 스크립트 등 이용하고 계시지 않나요?
​

# 03 해결 방법

 

# 03 - 01 첫번째 

체크하시려는 페이지와 동일한 페이지를 복사합니다.

 

# 03 - 02 두번째 

복사하신 페이지에 외부에서 불러오거나 사실상 필요 없는 (광고, 네이버 애널리틱스, 구글 애널리틱스 등) 스크립트를 제거합니다. 

 

# 03 - 03 세번째 

해당 페이지를 검사합니다! 

(하단 링크 또는 개발자도구 F12 -> 맨 오른쪽 탭의 Lighthouse)

 

https://pagespeed.web.dev/ (성능검사 링크)

 

# 04 마무리 

 

별로 팁도 아닌 거 같다고 여겨질 수 있겠지만, 저는 성능을 개선하기 위해 며칠을 고생했었는데 풀리지 않는 부분이 있었습니다.

당연히 구글에서 제공하고 네이버에서 제공하는 부분인데 문제가 있겠어?라는 생각을 가졌었는데..

믿는 도끼에 발등 찍혔다는 말을 딱 이때 쓰는 게 아닌가 싶네요..

 

저 같은 피해자가 생기지 않길 바라며 마칩니다!