[WP 플러그인] Async JavaScript 최적화 셋팅하기 (튜토리얼 2단계)

#Async JavaScript 최적화 셋팅 #가탈작 가이드

이 글을 통해 얻게 되는 정보

  • Async JavaScript 플러그인을 설치하는 이유
  • Async JavaScript 플러그인의 주요 기능
  • Async JavaScript 최적화 셋팅 절차와 방법

글의 순서

이 글의 목적은 워드프레스 웹사이트의 속도를 자동 최적화시켜주는 Async JavaScript 플러그인에 대해서 간단하게 이해한 뒤, Async JavaScript 플러그인을 설치하려는 이유, 플러그인의 설치 방법, 최적화 셋팅 방법에 대한 정보를 습득하는 것입니다. 

STEP 00 – Async JavaScript 플러그인을 설치하는 이유

Async JavaScript 최적화 셋팅

  • Async JavaScript 플러그인이란?
  • 자바스크립트 파일 로딩을 미뤄주는 플러그인입니다.
  • 자바스크립트(JavaScript) 파일이란?
  • 사이트는 파일로 구성된 집합체이고, 자바스크립트(JS) 파일은 사이트를 구성하는 파일 종류 중 하나입니다.
  • 자바스크립트(JavaScript) 파일 로딩을 미루는 것과 사이트 로딩 속도사이에는 어떤 관계가 있나요?
  • 사람들이 사이트에 방문했을 때 서버에서는 사이트를 보여주기 위해 HTML코드를 제공하고 브라우저에서 HTML 코드를 읽기 시작합니다. 하지만 중간에 자바스크립트 파일을 찾게 되면 HTML 읽는 것을 멈추고 자바스크립트 파일을 읽기 시작하면서 사이트 로딩이 늦춰지게 됩니다. 그러므로 이 플러그인을 통해 자바스크립트(JS) 파일 로딩을 늦춤으로써 사이트 로딩 속도를 보다 빠르게 가져갈 수 있게 됩니다.
  • Async JavaScript 플러그인의 기능 (←이 플러그인을 설치하는 이유)
    (1) 자바스크립트 파일 로딩을 미뤄서 사이트 로딩 속도를 빠르게 해줍니다.
    (2) 페이지 속도를 빠르게 하는 것은 검색 엔진 내 순위에 긍정적인 영향을 주는 중요한 요소입니다.
    (3) 웹사이트의 쾌적한 사용자 경험을 이끌어낼 수 있습니다.

#Async JavaScript 최적화 셋팅 #가탈작 가이드


STEP 01 – Async JavaScript 플러그인 설치

[설치 절차]

> 워드프레스 관리자 대시보드에 접속 

> 좌측 메뉴탭에 있는 플러그인 

> 새로추가 

> Async JavaScript 검색

> 지금 설치 

> 활성화 버튼 클릭 

> 플러그인 설치 완료

STEP 02 – Async JavaScript 최적화 셋팅

[셋팅 절차]

> 워드프레스 관리자 대시보드 

> 좌측 메뉴탭에 있는 ‘설정’ 항목 

> Async JavaScript 클릭 

> 상단 탭의 Settings 탭 클릭 

> Quick Settings 섹션 

> Apply Defer 버튼 클릭 

> 하단의 Save Settings 클릭

완료

수고하셨습니다!

정보가 도움이 되셨나요?

가탈작 가이드 웹사이트는

  자발적 정보 이용료로 운영됩니다.

인생은 GIVE & TAKE 라고 생각합니다. 

물론, 이용료 지불은 당신의 자유의지 입니다.


감사합니다!

[함께 보면 좋은 정보]

[가탈작 가이드 추천]

댓글 남기기