Categories Công cụ Perfmatters

Giải thích các tùy chọn của plugin Perfmatters (phần 1)

1. Emojis

  • Vô hiệu hóa emojis: Emojis rất vui nhộn (biểu tượng mặt cười, mặt mếu,…), nhưng kể cả khi bạn không sử dụng chúng, chúng vẫn tải một file JavaScript (có tên wp-emoji-release.min.js) trên tất cả các trang trên website của bạn. Điều này không cần thiết và làm gia tăng thời gian tải trang của nhiều website. Vì thế chúng tôi khuyến khích bạn vô hiệu hóa tính năng này.
file wp-emoji-release.min.js
wp-emoji-release.min.js

Trong plugin perfmatters bạn đơn giản vô hiệu hóa nó bằng cách bật tùy chọn “Disable Emojis”.

Vô hiệu hóa emojis bằng plugin perfmatters

Nếu bạn thực sự muốn sử dụng Emojis, chúng tôi khuyên bạn nên thử triển khai EmojiOne có tốc độ cao, chỉ sử dụng định dạng ảnh SVG. Tính năng này hoạt động tốt bên cạnh plugin perfmatters với việc vô hiệu hóa Emojis thông thường theo mặc định.

2. Embeds

  • Vô hiệu hóa Embeds: Embeds được phát hành từ phiên bản WordPress 4.4. Mục đích cơ bản của nó là chuyển đổi video YouTube, Tweets, và URL thành khung xem trước đẹp mắt trong khi bạn tiến hành biên tập bài viết. Dù vậy, điều này thực sự khiến website tải file JavaScript (wp-embed.min.js) trên tất cả các trang. Nếu bạn không quan tâm đến tính năng chuyển khung xem trước tự động, bạn có thể vô hiệu hóa nó trên toàn bộ website.
file wp-embed.min.js
wp-embed.min.js

Trong plugin perfmatters để làm điều này bạn chỉ cần bật tùy chọn “Disable Embeds”.

vô hiệu hóa tính năng embeds
Vô hiệu hóa embeds bằng plugin perfmatters

3. Query Strings

  • Loại bỏ chuỗi truy vấn (query strings) trong tài nguyên tĩnh: Chuỗi truy vấn, chẳng hạn như “?” hoặc “&” đôi khi được nối thêm vào phần cuối các tài nguyên (CSS, JS) trong WordPress, bên cạnh đó còn có thể có thông tin về số phiên bản, chẳng hạn như edd.min.css?ver=2.7.9. Các máy chủ proxy và CDN kiểu cũ có thể gặp rắc rối để cache những file này. Bạn cũng có khả năng thấy cảnh báo về chuỗi truy vấn được nhắc nhở trong các công cụ kiểm tra tốc độ website. Chúng ta có thể loại bỏ chuỗi truy vấn khỏi các tài nguyên tĩnh mà không phải lo lắng, và nó không gây hại gì cho trang của bạn cả.

Cập nhật: phiên bản mới của Perfmatters (1.6.6) đã bỏ tính năng Remove Query Strings.

Loại bỏ chuỗi truy vấn

Dưới đây là ví dụ trên trang web của chúng tôi trước khi loại bỏ chuỗi truy vấn:

các file tĩnh có chuỗi truy vấn
Chuỗi truy vấn trong tài nguyên tĩnh

Trong plugin perfmatters để làm điều này bạn chỉ cần bật tùy chọn “Remove Query Strings”.

loại bỏ chuỗi truy vấn
Loại bỏ chuỗi truy vấn qua plugin perfmatters

Và đây là ví dụ sau khi chúng tôi loại bỏ chuỗi truy vấn:

Chuỗi truy vấn bị loại bỏ khỏi tài nguyên tĩnh
Chuỗi truy vấn đã được loại bỏ trên tài nguyên tĩnh

Chú thích của Kiến càng: mặc dù có chỉ thị no-cache sử dụng ETag để biết nội dung cùng tên nào đó đã được cập nhật hay chưa (xem thêm HTTP caching), nhưng có lẽ để chắc chắn hơn trong việc tải nội dung mới khi trang cập nhật thì chúng ta không nên xoá chuỗi query string này. Tôi sẽ kiểm chứng thêm điều này & thông báo với các bạn sau.

Chuỗi truy vấn không được loại bỏ?

Đôi khi các nhà lập trình giao diện hoặc plugin không đưa ra các file được enqueue chính xác hoặc sử dụng các mã cứng (hard code) để tham chiếu đến số phiên bản. Điều này làm vô hiệu hóa khả năng kiểm tra hook WordPress để loại bỏ chính xác chuỗi truy vấn. Tình huống này không phải là vấn đề với plugin perfmatters, nhưng nó có nghĩa là bạn sẽ cần phải chỉnh sửa file của họ theo cách thủ công để loại bỏ chuỗi truy vấn.

Ví dụ 1 – Plugin Social Warfare

Một ví dụ điển hình là plugin Social Warfare WordPress. Bạn có thể thấy file này với chuỗi truy vấn: wp-content/plugins/social-warfare/fonts/sw-icon-font.woff?ver=2.2.5. Cách khắc phục duy nhất là chỉnh sửa plugin của họ để loại bỏ mã phiên bản được viết theo kiểu mã cứng. Chúng tôi không thích cách làm này, nhưng không may đây lại là cách sửa duy nhất.

chuỗi truy vấn của Social Warfare
Chuỗi truy vấn của Social Warfare

Với Social Warfare, file bạn cần chỉnh sửa là “header-meta-tags.php” nằm ở đường dẫn: /wp-content/plugins/social-warfare/functions/frontend-output/. Bạn có thể tải nó về thông qua FTP. Theo mặc định, file gốc sẽ trông giống như thế này:

plugin với chuỗi truy vấn
Plugin với chuỗi truy vấn

Bạn có thể loại bỏ mã cứng SWP_VERSION và nó sẽ sửa được vấn đề. Bên dưới là mã dùng để thay thế các dòng từ 86 đến 92 trong file, và đây là cách thức mà chúng tôi sử dụng trên trang của mình.

// Echo it if we're using the Admin Head Hook
		echo '
<style>@font-face {font-family: "sw-icon-font";src:url("' . SWP_PLUGIN_URL . '/fonts/sw-icon-font.eot");src:url("' . SWP_PLUGIN_URL . '/fonts/sw-icon-font.eot?#iefix") format("embedded-opentype"),url("' . SWP_PLUGIN_URL . '/fonts/sw-icon-font.woff") format("woff"),
	url("' . SWP_PLUGIN_URL . '/fonts/sw-icon-font.ttf") format("truetype"),url("' . SWP_PLUGIN_URL . '/fonts/sw-icon-font.svg?#1445203416") format("svg");font-weight: normal;font-style: normal;}</style></pre>
'; else : // Add it to our array if we're using the froSntend Head Hook $info['html_output'] .= PHP_EOL . '
<pre><style>@font-face {font-family: "sw-icon-font";src:url("' . SWP_PLUGIN_URL . '/fonts/sw-icon-font.eot");src:url("' . SWP_PLUGIN_URL . '/fonts/sw-icon-font.eot?#iefix") format("embedded-opentype"),url("' . SWP_PLUGIN_URL . '/fonts/sw-icon-font.woff") format("woff"), url("' . SWP_PLUGIN_URL . '/fonts/sw-icon-font.ttf") format("truetype"),url("' . SWP_PLUGIN_URL . '/fonts/sw-icon-font.svg?#1445203416") format("svg");font-weight: normal;font-style: normal;}</style>
';

Và như bạn có thể thấy bên dưới, chuỗi truy vấn trên file Social Warfare giờ đã được loại bỏ.

chuỗi truy vấn đã được loại bỏ
Chuỗi truy vấn đã được loại bỏ trên Social Warfare

Chuỗi truy vấn và khả năng tương thích với Page Builders

Trong phần lớn trường hợp, chúng tôi nhận thấy việc loại bỏ chuỗi truy vấn gây ra vấn đề với các plugin page builder phổ biến như ElementorBeaver Builder. Điều này đơn giản là vì họ dựa trên các phiên bản của CSS để chạy. Vì thế, chúng tôi không khuyến khích bạn bật tính năng này cho đến khi hoàn tất thiết kế. Dù sao, nó có thể dễ dàng vô hiệu hóa trong khi bạn thực hiện thay đổi và rồi sau đó bật lại.

4. XML-RPC

XML-RPC được thêm vào trong WordPress từ phiên bản 3.5 và cho phép kết nối từ xa, và trừ khi bạn sử dụng thiết bị di động để đăng bài còn không thì sự tồn tại của nó hại nhiều hơn là lợi. Trong thực tế, nó có thể khiến trang web của bạn đối mặt với hàng loạt nguy cơ bảo mật. Có một số plugin sử dụng XML-RPC, chẳng hạn như plugin JetPack, nhưng chúng tôi không khuyến khích dùng JetPack vì nó sẽ làm suy giảm hiệu suất.

Trong plugin perfmatters, bạn có thể dễ dàng vô hiệu hóa nó bằng cách bật tùy chọn “Disable XML-RPC”. Lưu ý: nếu bạn là khách hàng của Kinsta (công ty hosting chuyên cho WordPress), XML-RPC được vô hiệu hóa theo mặc định.

vô hiệu hóa XML-RPC
Vô hiệu hóa XML-RPC trong prefmatters

Bạn có thể xác nhận XML-RPC đã được vô hiệu hóa hay chưa bằng cách sử dụng công cụ miễn phí XML-RPC validation. Nếu bạn thấy lỗi cảnh báo như bên dưới thì có nghĩa là bạn đã làm đúng.

kiểm tra xem đã làm đúng hay chưa trong việc loại bỏ XML-RPC
Kiểm tra xem đã làm đúng hay chưa trong việc loại bỏ XML-RPC

Khi tôi thử kiểm tra lại trang Kiến càng cũng thấy nó đã vô hiệu hoá thành công XML-RPC:

trang Kiến càng vô hiệu hoá XML-RPC

Điều này cũng loại bỏ tiêu đề phản hồi HTTP XML-RPC liên kết với nó.

loại bỏ tiêu đề phản hồi HTTP XML-RPC
Tiêu đề phản hồi HTTP XML-RPC

Mời bạn xem tiếp phần 2 nói về các tùy chọn ở đây.

Back to Top