Triển khai tải trước, tải trước, kết nối trước trong WordPress

Tận dụng các tính năng của trình duyệt hiện đại như tải trước, tải trước, kết nối trước để làm cho trang web WordPress nhanh hơn.


Là chủ sở hữu trang web, người không thích làm mọi thứ có thể để tải trang web nhanh hơn?

Đảm bảo tải trang web nhanh hơn nhất quán trên toàn thế giới là một thách thức. Có một số điều bạn có thể làm để tải tài nguyên trang web một cách nhanh chóng, bao gồm bật các mục sau gợi ý trình duyệt. Họ còn được gọi là kỹ thuật duyệt trước.

Lưu ý: kỹ thuật gợi ý trình duyệt không giúp được nhiều khi bạn truy cập trang web lần đầu tiên, nhưng các yêu cầu tiếp theo nhanh hơn.

Tải trước

Bạn có thể sử dụng thẻ tải trước để báo cho trình duyệt tìm nạp một số tài nguyên tĩnh sớm. Chúng có thể là một hình ảnh, phông chữ, JavaScript, CSS, tập lệnh, video, v.v … Nó giúp ưu tiên tải tài nguyên; do đó, hiệu suất được cải thiện.

Tải trước sẽ là một ý tưởng tốt để thực hiện nếu bạn muốn người dùng của mình truy cập nhiều trang sau đó. Giống như cửa hàng Thương mại điện tử nơi người dùng truy cập trang sản phẩm và sau đó kiểm tra thông tin, so sánh với sản phẩm khác, thêm vào giỏ hàng, thanh toán, v.v..

Bạn có thể sử dụng các plugin sau để thiết lập tính năng Tải trước.

Gợi ý tài nguyên tốt hơn – một plugin miễn phí để định cấu hình các tệp CSS và JS.

WP Rocket – một plugin cao cấp để nâng cao hiệu suất trang web với nhiều kỹ thuật thiết yếu, bao gồm tải trước bộ đệm và sơ đồ trang web.

Làm thế nào để bạn biết nếu tải trước được kích hoạt?

Cách nhanh nhất để tìm hiểu là bằng cách xem nguồn trang. Bạn sẽ thấy một cái gì đó như dưới đây.

Không phải tất cả các trình duyệt đều hỗ trợ Preload trong khi viết. Vì vậy, hãy kiểm tra ma trận tương thích trước khi thực hiện.

Kết nối trước

Bạn có tải tài nguyên từ các tên miền khác không? Có thể là CDN?

Nếu không, và mọi tài nguyên đang được tải từ một miền duy nhất của bạn, thì điều này có thể không hữu ích.

Trình duyệt gợi ý kết nối trước để thiết lập kết nối với các tên miền khác trong nền để tiết kiệm thời gian tra cứu DNS, chuyển hướng, bắt tay TCP, đàm phán TLS, v.v. Ý tưởng là giảm độ trễ để cung cấp tải tài nguyên nhanh từ một tên miền khác.

Một lần nữa, bạn có thể sử dụng plugin gợi ý tài nguyên tốt hơn được đề cập ở trên hoặc plugin cao cấp như nước hoa.

Sau khi định cấu hình các tài nguyên được yêu cầu, bạn sẽ thấy chúng trong nguồn trang như bên dưới.

Lưu ý: nếu bạn đang tải tài nguyên từ một miền yêu cầu CORS thì bạn cần chỉ định đó là crossorigin và đầu ra sẽ giống như.

Kết nối tương thích với phiên bản mới nhất của Chrome, Edge, Firefox, Safari.

Tải trước

Hãy để trình duyệt tìm nạp trang tiếp theo mà bạn nghĩ sẽ cần khi người dùng điều hướng xung quanh. Prefetch sẽ tải xuống các tài nguyên cần thiết và lưu trữ chúng trong bộ đệm cục bộ và phục vụ chúng nhanh chóng khi cần. Có hai loại tìm nạp trước.

Tìm nạp trước DNS – giải thích bên dưới

Liên kết tìm nạp trước – cấu hình bằng cách sử dụng. Được sử dụng để tìm nạp trước HTML hoặc tài nguyên tĩnh. Bạn có thể tìm nạp trước các tài nguyên bằng cách sử dụng như một thuộc tính.

vì thuộc tính hỗ trợ các tài nguyên khác nhau như âm thanh, video, tập lệnh, bản nhạc, kiểu, phông chữ, đối tượng, tài liệu, v.v. Tìm nạp trước liên kết có thể được cấu hình với sự trợ giúp của Plugin gợi ý tài nguyên trước bữa tiệc.

Tải trước DNS

Đang tải tài nguyên từ nhiều tên miền và muốn giải quyết chúng trong nền?

Thiết lập nhanh này có thể giúp giải quyết tất cả các miền tiềm năng trước đó để khi tài nguyên được yêu cầu, nó sẽ tải nhanh hơn. Điều này giúp giảm độ trễ tổng thể.

Hãy nói rằng bạn đang tải tài nguyên từ 3 tên miền và mỗi tên miền mất khoảng 100ms để thực hiện tra cứu DNS thì bạn sẽ tiết kiệm được độ trễ 300ms.

Thật tuyệt?

Bạn có thể thực hiện bằng cách sử dụng plugin perfmatters hoặc thêm phần sau vào tệp tin.php của chủ đề nếu bạn cảm thấy thoải mái khi chỉnh sửa các tệp chủ đề.

// * Tìm nạp trước DNS
hàm dns_prefetch () {
tiếng vang ‘

}
add_action (‘wp_head’, ‘dns_prefetch’, 0);

Bạn có thể đọc thêm tại Tài liệu web Mozilla.

Tiên tri

Bạn có mong đợi người dùng trang web của bạn điều hướng trang tiềm năng?

Prerender có thể giúp tải những tài sản đó trong nền và khi người dùng nhấp vào nó, họ sẽ nhận được nó rất nhanh. Bạn có thể đạt được điều này với plugin Gợi ý tài nguyên của Pre Party.

Prerendering phù hợp cho một trang hoặc tài sản nhẹ, nhưng hãy cẩn thận với toàn bộ trang web hoặc tài nguyên lớn vì nó có thể làm tăng việc sử dụng CPU và băng thông và làm chậm trang web. Vì vậy, hãy thử với tài nguyên nhỏ hơn và kiểm tra nó để đảm bảo nó không có tác dụng phụ.

Như bạn có thể thấy, có bốn plugin chính liên quan để thực hiện các gợi ý trình duyệt trong WordPress. Chọn một trong những bạn thích và phù hợp với yêu cầu.

Plugin gợi ý tài nguyên trước bữa tiệc – một plugin miễn phí cung cấp DNS-prefetch, liên kết prefetch, prerender, preconnectect và preload.

Gợi ý tài nguyên tốt hơn – một thay thế cho ở trên.

Các plugin miễn phí là tốt miễn là nó được duy trì và hỗ trợ. Thật không may, điều này không xảy ra đối với nhiều plugin và đó là lý do tại sao đôi khi nó lại tốt hơn cho phiên bản trả phí. Các plugin phiên bản thương mại được hỗ trợ chuyên nghiệp và cập nhật với tiêu chuẩn WordPress & sửa lỗi bảo mật. Nếu bạn sẵn sàng chi một vài đô la để tối ưu hóa hiệu suất trang web của mình, thì bạn có thể kiểm tra những điều sau đây.

WP Rocket – có uy tín, được tin cậy bởi hơn 800.000 trang web. Nó có giá 49 đô la cho một trang web.

Nước hoa – một trọng lượng nhẹ với dễ theo dõi có giá 24,95 đô la cho một trang web. Khi tôi viết, nó cung cấp các tính năng sau.

Đó là rất nhiều tối ưu hóa.

Phần kết luận

Lõi WordPress có trọng lượng nhẹ, nhưng nó trở nên cồng kềnh phụ thuộc vào chủ đề và plugin bạn sử dụng. Và, điều cần thiết là tối ưu hóa hiệu suất trang web của bạn để xếp hạng và chuyển đổi tìm kiếm tốt hơn. Các kỹ thuật trên rất dễ thực hiện, nhưng bạn không nên dừng lại ở đó.

Bạn cũng nên cân nhắc sử dụng CDN để lưu trữ và cung cấp nội dung nhanh hơn cho người dùng của mình trên toàn cầu. Có rất nhiều, nhưng tôi khuyên bạn nên thử SUCURI, người cung cấp CDN và bảo mật, cả hai.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map