VietNetwork.Vn

Thời gian đánh giá tập lệnh (script evaluation time) cho biết thời gian cần thiết để tải, phân tích cú pháp và thực thi các tệp JavaScript.

JavaScript chạy trên luồng chính và vấn đề là khi thời gian đánh giá tập lệnh này chặn luồng chính dẫn đến tăng thời gian tải cùng với trải nghiệm người dùng và hiệu suất trang kém.

Nếu JavaScript không tải và thực thi đúng thời gian thì nội dung khác trên trang web của bạn sẽ bắt đầu chờ JavaScript thực thi đúng cách, dẫn đến:

• Tăng thời gian tải trang
• Khó khăn khi hiển thị phông chữ/gif/hình ảnh/video
• Tăng thời gian tải HTML và CSS
• Không nắm bắt được đầu vào của người dùng

Vì vậy, tối ưu hóa JavaScript là điều cần thiết. Hôm nay chúng tôi sẽ chỉ cho bạn một số cách hiệu quả nhất để tăng tốc trang web WordPress của bạn và các cách để giảm thời gian đánh giá tập lệnh.

Những kỹ thuật này có thể tác động đáng kể đến trải nghiệm người dùng, tốc độ tải và xếp hạng SEO trên trang web của bạn, đồng thời có thể cải thiện điểm hiệu suất của Lighthouse.

1. Giảm/Hạn chế sử dụng tập lệnh của bên thứ ba

Tập lệnh của bên thứ ba là bất kỳ tập lệnh nào được nhúng vào trang web của bạn từ nhà cung cấp bên ngoài.

Việc sử dụng tập lệnh của bên thứ ba có thể cho phép bạn mở khóa các tính năng hữu ích, đồng thời giúp bạn tiết kiệm thời gian và tài nguyên, nhưng nó có thể gây ra hậu quả nghiêm trọng cho trang web của bạn nếu bạn không cẩn thận.

Nó bao gồm các vấn đề như thời gian phân tích tập lệnh dài và khối lượng công việc nặng nề của luồng chính, cuối cùng làm chậm quá trình hiển thị trang. Ngoài ra, điều này còn tiêu tốn nhiều CPU, dẫn đến sự chậm trễ trong tương tác của người dùng và tác động tiêu cực đến trải nghiệm người dùng.

Dưới đây là một số ví dụ có thể chạy mã của bên thứ ba trên trang web WordPress của bạn:

• Plugin liên quan đến quảng cáo
• Plugin phần mềm
• Plugin phân tích
• Cổng thanh toán
• Plugin thương mại điện tử
• Chatbot trực tuyến
• Thư viện video, âm thanh và hình ảnh
• Plugin chia sẻ phương tiện truyền thông xã hội

Khi bạn phân tích trang web của mình bằng  Google PageSpeed Insights, bạn sẽ thấy thời gian các tập lệnh của bên thứ ba đang chặn luồng chính.


Để khắc phục những sự cố này, hãy thử nhập ít video, bài đăng trên mạng xã hội và biểu tượng chia sẻ trên mạng xã hội, đồng thời tắt tất cả các tập lệnh không cần thiết của bên thứ ba mà bạn thấy trong Google PageSpeed Insights.

2. Tải trước các tập lệnh quan trọng và lưu trữ cục bộ các tập lệnh của bên thứ ba

Bạn có thể sử dụng tính năng kết nối trước/tải trước và tìm nạp trước DNS để tải trước các tập lệnh cần thiết của bên thứ ba, việc này sẽ thiết lập kết nối sớm với máy chủ của bên thứ ba. Bạn có thể xem thêm thông tin tại đây –  Kết nối trước với nguồn gốc được yêu cầu.

Việc sử dụng Kết nối trước/tải trước và tìm nạp trước DNS sẽ yêu cầu trình duyệt thiết lập kết nối sớm với các trang web/máy chủ của bên thứ ba khác.

Bạn cũng có thể sử dụng  Gợi ý ban đầu của Cloudflare. Khi được bật, Cloudflare sẽ lưu vào bộ đệm các tập lệnh có tiêu đề kết nối trước/tải trước và các trình duyệt sẽ bắt đầu tìm nạp trước các nội dung được liên kết khi chờ phản hồi cuối cùng của máy chủ bên thứ ba khác, từ đó cải thiện tốc độ tải trang web của bạn.


Để bật Gợi ý sớm của Cloudflare, hãy điều hướng đến  phần Tốc độ  >  Tối ưu hóa  từ bảng điều khiển Cloudflare, cuộn xuống  phần Gợi ý sớm  và nhấp vào nút chuyển đổi.

Bạn cũng có thể lưu trữ các tập lệnh và chức năng của bên thứ ba như Google Analytics, phông chữ Google và trình quản lý thẻ Google cục bộ trên máy chủ web của mình. Bạn có thể sử dụng các plugin miễn phí như  OMGF  để lưu trữ phông chữ google cục bộ và sử dụng  Flying Analytics  để lưu trữ Google Analytics cục bộ.

3. Xóa tập lệnh không sử dụng

Để cải thiện thời gian đánh giá tập lệnh, bạn nên xóa các tập lệnh không cần thiết/dư thừa mà trang web của bạn không cần để hoạt động bình thường.

Giả sử bạn có một trang blog nơi bạn đã định cấu hình một thanh bên có biểu mẫu liên hệ hoặc các tùy chọn chia sẻ trên mạng xã hội và bạn đã đính kèm thanh bên này vào mọi bài đăng blog mà bạn có trên trang web của mình.

Bạn có thể có hàng trăm hoặc hàng nghìn bài đăng blog trên trang web của mình và trong trường hợp này, thanh bên này tải biểu mẫu liên hệ hoặc tùy chọn chia sẻ trên mạng xã hội mỗi khi ai đó tải một bài đăng trên trang web của bạn và nó chặn chuỗi chính dẫn đến thời gian tải chậm hơn.

Để xem các tập lệnh không cần thiết đang chạy trên trang web của bạn, bạn có thể phân tích trang web của mình trong  Google PageSpeed Insights, xem  phần Giảm JavaScript không được sử dụng.


4. Hoãn và trì hoãn JavaScript

Khi trình duyệt mở một trang web, nó sẽ cố tải trang web từ trên xuống dưới nhưng nếu tìm thấy bất kỳ mã JavaScript nào, mức độ ưu tiên của trình duyệt sẽ chuyển sang phân tích cú pháp, tải và thực thi các mã này trước khi thử tải nội dung của trang web. tăng thời gian tải trang web của bạn.

Vấn đề này có thể được giải quyết bằng cách trì hoãn phân tích cú pháp JavaScript để cho phép trình duyệt tải toàn bộ nội dung của trang web trước mà không cần đợi Tập lệnh hoàn thành giai đoạn phân tích cú pháp và do đó giảm thời gian tải trang web.

Bạn có thể nhận được hiệu suất cao hơn từ trang web WordPress của mình bằng cách trì hoãn JavaScript. Điều này có thể trì hoãn những việc như tìm nạp và phân tích tập lệnh trong vài giây và tập trung vào các tài nguyên như văn bản và hình ảnh mà người dùng muốn xem ngay lập tức.

Lợi ích của việc trì hoãn và trì hoãn JavaScript là:

• Trải nghiệm người dùng tốt hơn
• Xếp hạng SEO tốt hơn
• Ưu tiên tập lệnh tốt hơn
• Tận dụng tốt hơn khối lượng công việc chính
• Thời gian thực thi javascript tốt hơn
• Ít ưu tiên các tập lệnh chặn kết xuất

Để trì hoãn JavaScript, bạn có thể dùng thử  plugin Asset CleanUp: Page Speed Booster.

Đầu tiên, Cài đặt và kích hoạt plugin Asset CleanUp: Page Speed Booster.

Để kích hoạt trì hoãn JavaScript, hãy điều hướng đến  Asset CleanUp  và nhấp vào  Cài đặt.


Bây giờ, cuộn xuống và nhấp vào  Tối ưu hóa JavaScript > Kết hợp JS đã tải (JavaScript) thành ít tệp hơn  rồi chọn  hai tùy chọn bên dưới  Kết hợp JS đã tải.


5. Áp dụng tách mã

Nếu bạn đang gặp sự cố khi tải các tệp JavaScript lớn thì bạn có thể thử tách mã để chia JavaScript thành các đoạn mã nhỏ hơn.

Việc áp dụng tính năng tách mã có thể giúp trang web của bạn tải các tập lệnh nhỏ hơn một cách thông minh mà không phải tải các tập lệnh chặn hiển thị lớn.

Bạn có thể sử dụng  POP  để áp dụng tính năng chia tách mã cho trang web WordPress của mình. Đó là một framework mã nguồn mở được tạo riêng cho WordPress.

Lưu ý: Bạn phải luôn áp dụng tính năng phân tách mã trước khi thu nhỏ JavaScript của mình.

6. Giảm thiểu tập lệnh

Nhà phát triển WordPress cố gắng viết mã theo cách mà các nhà phát triển khác có thể hiểu được.

Các nhà phát triển sử dụng các ký tự như khoảng trắng, nhận xét, gợi ý, v.v. để làm cho nó dễ đọc hơn.

Máy tính có thể thực thi mã mà không cần khoảng trắng và chú thích.

Việc giảm thiểu sẽ loại bỏ các ký tự vô dụng này và cố gắng làm cho mã nhẹ hơn cũng như giảm dữ liệu cần truyền cho khách truy cập, điều này tác động tích cực đến thời gian tải tập lệnh và mức sử dụng băng thông trên trang web của bạn.

Bạn có thể dễ dàng thu nhỏ JavaScript của mình bằng  các chức năng tự động thu nhỏ của Cloudflare.

Để bật tính năng tự động thu nhỏ, hãy điều hướng đến  phần Tốc độ  >  tối ưu hóa  từ Bảng điều khiển Cloudflare, sau đó cuộn xuống  Tự động thu nhỏ > JavaScript  và nhấp vào hộp kiểm.


6.1. Nén tập lệnh (Gzip và Brotli)

Nén tập lệnh là quá trình giảm kích thước tệp bằng cách mã hóa tệp JavaScript.

Việc nén làm cho các tập lệnh chiếm ít không gian hơn trong máy chủ web và tốn ít thời gian hơn để truyền tệp sang các máy chủ khác của bạn.

Cloudflare giúp tăng tốc thời gian đánh giá JavaScript bằng cách nén tập lệnh bằng cách sử dụng nén Brotli hoặc Gzip. Cloudflare thích nén Brotli hơn nhưng sử dụng nén Gzip nếu máy khách không hỗ trợ nén Brotli. Google đã phát triển thuật toán nén Brotli để giúp các trang web tải dữ liệu nhanh hơn bằng cách cắt giảm chi phí truyền dữ liệu.

Điều tuyệt vời nhất là dễ dàng thiết lập tính năng nén Brotli bằng Cloudflare.

Để bật nén Brotli,  hãy điều hướng đến  phần Tốc độ  >  tối ưu hóa  từ Bảng điều khiển Cloudflare, cuộn xuống  nén Brotli và nhấp vào nút chuyển đổi.


6.2. Sử dụng Trình tải tên lửa Cloudflare

Chúng tôi đã thảo luận về lợi ích của việc sử dụng JavaScript khác nhau, trì hoãn JavaScript và ưu tiên nội dung trang web (văn bản, hình ảnh, phông chữ, v.v.)

Bằng cách sử dụng trình tải tên lửa Cloudflare, bạn có thể có được tất cả những lợi ích này chỉ bằng một cú nhấp chuột.

Trình tải tên lửa Cloudflare có thể giúp bạn có được:

• Tốc độ tải trang web tốt hơn
• Xếp hạng SEO google tốt hơn
• Trải nghiệm người dùng tốt hơn
• Ưu tiên javascript tốt hơn
• Giảm thiểu khối lượng công việc chính tốt hơn
• Thời gian thực thi javascript tốt hơn
• Tối ưu hóa tốt hơn các tập lệnh chặn hiển thị
• Ưu tiên tốt hơn nội dung trang web của bạn

Để bật  trình tải tên lửa Cloudflare, hãy điều hướng đến  phần Tốc độ  >  Tối ưu hóa  từ bảng điều khiển Cloudflare, cuộn xuống  phần Trình tải Rocker  và nhấp vào nút chuyển đổi.


7. Sử dụng Cloudflare APO

Cloudflare APO (Tối ưu hóa nền tảng tự động) lấy toàn bộ trang web của bạn và lưu trữ nó trong mạng máy chủ nội bộ của Cloudflare.

Cloudflare có nhiều máy chủ trải rộng trên toàn thế giới. Đó là cách người dùng của bạn nhận được nội dung trang web của bạn được phân phối nhanh nhất và nhất quán nhất, bất kể họ ở đâu. 

Bạn có thể xem thêm thông tin tại đây –  Cloudflare APO   Đăng nhập để xem liên kết