코드 리팩토링과 유사하게 "쓸모없어 보이는" 코드를 쉽게 제거하지 마세요. 익숙하지 않은 것을 쉽게 바꾸면 더 많은 문제가 발생하고 더 좌절감을 느낄 수 있습니다. 며칠 전 큰 구멍을 뚫고 헤매다 보니 눈앞에 보이는 '쓸데없는 것'이 사실은 쓸모 없는 것이 아니라는 걸 깨달았다.
며칠 전 PageSpeed Insights를 사용하여 사이트 로딩 속도를 테스트했습니다. 테스트 결과에 따르면 쓸모없는 dashicons.min.css를 제거하는 것 외에는 현재 최적화할 여지가 없습니다.
사용자에게 더 높은 평가와 더 빠른 로딩 속도를 제공하기 위해 우리는 이 "쓸모없는" CSS 파일을 제거하기로 결정했습니다. 예상하지 못한 점은 해당 링크 태그를 파일에서 직접 찾을 수 없다는 점이었습니다. Google에서 검색한 결과 다음 코드를 찾아 현재 테마의 grep
functions.php 파일에 넣었습니다.
// remove dashicons in frontend to non-admin function wpdocs_dequeue_dashicon() { if (current_user_can( 'update_core' )) { return; } wp_deregister_style('dashicons'); } add_action( 'wp_enqueue_scripts', 'wpdocs_dequeue_dashicon' );변경 후 다시 테스트해 보세요.
dashicons.min.css 예상대로 다시 로드되지 않았습니다. 완벽합니다!
오늘 웹사이트 페이지를 확인했을 때 오른쪽 하단에 있는 "맨 위로 가기" 버튼이 사라지고 왼쪽 하단에 스타일이 지정되지 않은 "위로 스크롤" 텍스트로 대체된 것을 발견했습니다. "맨 위로" 플러그인에 의해 설정된 플로팅 버튼은 어디에 있나요? 다음으로 다양한 검사를 시작합니다. 자동 최적화 플러그인에 문제가 있습니까? "to top" 플러그인과 호환되지 않나요? 캐시 문제인가요? 백엔드 로그인 후 버튼이 다시 나타나는 이유는 무엇인가요? 다양한 문제가 기다리고 있습니다. 결국 요소를 검토하고 로그인 전과 후의 변경 사항을 비교하여 문제를 찾기로 결정했습니다. 보시다시피 html 요소는 일관성이 있지만 일부 CSS 속성이 누락되어 있습니다. 누락된 CSS 속성을 추가하고 나면 거의 사용할 수 없지만 모양이 어색합니다. 주의 깊게 살펴보면 "dashicons" 클래스의 CSS 설정이 존재하지 않는 것을 알 수 있습니다. 잠깐, CSS "dashicons" 클래스가 왜 친숙해 보일까요? 잘 기억해보면 며칠 전에dashicons.min.css를 삭제하지 않았나요? 이것이 문제가 될 수 있습니까? ! !
그래서 며칠 전에 추가된dashicons.min.css 코드를 주석 처리하고 다시 테스트해 보니 익숙한 "맨 위로 가기" 아이콘이 돌아왔습니다!