불필요한 .js와 .css 호출을 제거하십시오 (Rt-Theme19 - themeforest)

Question

나는 (위에서 말한) 간단한 WP 사이트를 가지고 있습니다.

테마는 렌더링 블로킹을 유발하는 외부 .css 및 .js 파일을 폴딩합니다. 나는 그 중 절반을 사용하지 않을 것입니다.

header.php는 직접 몇 개만 포함하고 대부분은 php wp_head() 태그를 통해 포함됩니다. 알아 내는데 고심하고 있는데, .js와 .css 은 (는)을 사용하고 있습니다. 또한 하는 방법은 내가 '지연'또는 '비동기'를 사용하는 것이 문제를 부분적으로 만 해결하는 것 같아서 완전히을 제거합니다.

내 사이트는 http://toptand.dk입니다. 현재 WP Super Cache를 사용하여 압축 및 자동 축소 기능을 사용하여 렌더링 차단 등을 최소화하여 헤더 모양을 매우 다르게 만들 수 있습니다. 나는 오히려 그것을 현실적으로 제거하려고합니다.

저는 렌더링 차단을 방지하는 방법에 대한 기사를 많이 읽었지만 실제로 WP 템플릿의 모든 쓰레기 처리 방법에 대해서는 설명하지 않았습니다.

Answer 1

주제는 외부 .CSS의 톤을로드하고 나는 내가 그들의 절반을 사용하지 않는 확신 차단 렌더링의 원인이되는 배 위 .js 파일.

이것은 상용 WordPress 테마에서 매우 일반적입니다. 이러한 테마는 짧은 코드, 드래그 앤 드롭 기능, 사용자 정의 게시물 유형, 전자 상거래 등을 제공하는 "다목적"백엔드 기능에 필요한만큼 많은 파일을로드합니다.

모든 사용자가 속도와 페이지 무게를 희생합니다. 당신이 사용하지 않는 잠재적 기능뿐만 아니라 당신이 사용하는 기능들. 속도와 경량 사이트가 필요한 경우 그런 주제를 사용하지 마십시오. 당신은 수 해당 테마로 가서 wp_dequeue_script 스크립트와 스타일 시트,하지만 기능 테마가 중단됩니다. https://codex.wordpress.org/Function_Reference/wp_dequeue_script

https://wordpress.org/themes/에서 더 간단하고 가벼운 (무료) 테마를 시도하고 https://developer.wordpress.org/themes/getting-started/의 테마 작동 방식을 알아보십시오. 추가 코드없이 원하는 기능을 사용할 수 있습니다.

Answer 2

Chrome 개발자 도구의 감사 탭을 활용할 수 있습니다.

나는 이

에서, 감사 탭을 선택하면 아닌 필요에 따라 네트워크 이용을 포함하지만 의무적으로 웹을 확인하는 된 .js와 .CSS를 사용하고있는 찾아 고군분투 페이지 성능 옵션. 선택이 완료되면 현재 상태 감사 또는 다시로드 및 감사를 클릭하십시오.

프로세스가 완료되면 결과에 사용되지 않은 CSS 규칙 수가 입력됩니다. 이렇게하면 사용하지 않는 CSS에 대한 아이디어를 얻을 수 있습니다. 내가 부분적으로 만 문제를 해결한다 '연기'또는 '비동기'를 사용하여 같은 느낌 때문에

또한 방법

완전히 그들을 제거합니다.

최근 버전의 Chrome (59)은 새로운 기능인 Coverage를 가져 왔습니다.이 기능은 개발자 도구의 추가 도구에서 찾을 수 있습니다. 이렇게하면 현재 페이지에서 사용중인 CSS의 비율을 파악하고 결과 중 하나를 클릭하면 코드로 리디렉션되고 실행되지 않은 코드의 부분은 빨간색으로 표시되고 실행 된 코드는 녹색으로 표시됩니다.

이 입력

당신이 당신의 자산을 최적화하고 사용되지 않는 코드를 제거해야합니다.

희망이 도움이됩니다.