Hướng dẫn dùng parshing JavaScript

Th7 11, 2017

Hai G.

2ít nhất Đọc

• Giới thiệu
• Bạn cần gì        
• Bước 1 — Phân tích website
• Bước 2 — Defer Parsing of JavaScript trong WordPress
• Bước 3 — Kiểm tra thay đổi
• Kết luận

Giới thiệu

Có nhiều lý do để bạn tiến hành Defer Parsing of JavaScript cho trang Web của mình. Tuy nhiên, lý do quan trọng nhất là để cải thiện tốc độ Website. Thường thì các đoạn mã JavaScript sẽ được đặt trong thẻ . Khi Website được tải về thì các đoạn mã code cũng sẽ được đọc từ trên xuống dưới. Vì vậy, nếu bạn có nhiều đoạn JavaScript hoặc nhiều mã code ở đây thì sẽ mất nhiều thời gian để tải nội dung trên trang (vì phải tải hết mã JavaScript trước). Do đó, việc tăng tốc Website sẽ được thực hiện khi Defer Parsing of JavaScript, vì lúc này site sẽ được tải mà không đợi mã JS code hoàn tất. Bài hướng dẫn này sẽ chỉ bạn 2 cách để defer parsing of JavaScript trong WordPress.

Bạn cần gì        

Trước khi bắt đầu bạn cần chuẩn bị:

• Truy cập vào trang quản trị WordPress
• Truy cập được FTP/cPanel

Bước 1 — Phân tích website

Để biết bạn có cần làm việc này cho website WordPress không, bạn có thể dùng  GTMetrix tool.

Điểm trung bình lý tưởng trên GTMetrix cần đạt ít nhất 71%. Đây là kết quả từ việc kiểm tra một website WordPress:

Bước 2 — Defer Parsing of JavaScript trong WordPress

Có nhiều lựa chọn để bạn thực hiện defer parsing of JS trên site WordPress của bạn.

QUAN TRỌNG! Cần đảm bảo backup website trước khi tiến hành.

Lựa chọn 1 – Deferring parsing of JavaScript bằng WordPress plugins

Một trong các cách dễ nhất để defer JS parsing trong WordPress là bằng cách dùng plugin WP Deferred JavaScript.

Một plugin khác có thể giúp bạn defer parsing of JavaScript là Speed Booster Pack, cũng có cung cấp vài tính năng để tối ưu WordPress

Sau khi cài đặt Speed Booster Pack bạn sẽ cần tới mục Settings plugin.

Chọn box Defer parsing of javascript files và nhấn Save Changes

Nếu bạn không biết làm thế nào để cài đặt Plugin WordPress, bạn có thể tham khảo thông tin chi tiết tại đây here.

Lựa chọn 2 – Deferring parsing of JavaScript qua functions.php

Để defer parsing of JS, mã này cần được dán vào cuối của file wp-includes/functions.php:

function defer_parsing_of_js ( $url ) {
 if ( FALSE === strpos( $url, '.js' ) ) return $url;
 if ( strpos( $url, 'jquery.js' ) ) return $url;
 return "$url' defer ";
 }
 add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );

Bước 3 — Kiểm tra thay đổi

Sử dụng cùng công cụ để kiểm tra tốc độ website. Đây là kết quả hiệu năng sau khi deferring JavaScript parsing:

Chúc mừng, bằng cách làm theo các bước sau đây, bạn đã tăng tốc hiệu năng của website nhanh hơn và cho trải nghiệm người dùng tốt hơn!

Kết luận

Trong hướng dẫn ngắn này, chúng tôi cho bạn biết cách tăng tốc và tăng hiệu năng của website WordPress bằng cách deferring parsing of JavaScript. Hãy nhớ, website càng nhanh càng mượt chừng nào, lượt truy cập và số lượng khách truy cập vui vẻ càng tăng!

Các bài hướng dẫn liên quan:

• How to Remove Query Strings From JavaScript and CSS in WordPress
• How to Install WP Super Cache on WordPress
  
• Optimize WordPress Images with WP Smush

Hãy bắt đầu dựng website của bạn bây giờ.

Hải G. là chuyên gia quản lý, vận hành các dịch vụ website. Anh có nhiều năm kinh nghiệm về VPS, Hosting, technical SEO, CMS. Đặc biệt yêu thích WordPress và đã dùng nó hơn 5 năm nay. Sở thích của anh là đọc, viết blog, đi du lịch và tư vấn cho các bạn trẻ khởi nghiệp.