Nội dung
Khẳng định rằng, FlyingPress là một plugin cache vượt trội và đáng chú ý trong cả việc tối ưu hóa tốc độ trang web. Điều đặc biệt là, hiệu suất ấn tượng của FlyingPress không bám vào việc sử dụng LiteSpeed Server, khác biệt với quan điểm thường thấy. Thực tế, plugin này đã chứng tỏ khả năng tối ưu hóa thông qua việc tận dụng tài nguyên một cách thông minh và triển khai các chiến lược cache độc đáo. Điều này cất lên tiếng nói rằng FlyingPress không chỉ là lựa chọn hàng đầu cho những ai sử dụng máy chủ LiteSpeed, mà còn phù hợp với nhiều loại máy chủ khác nhau.
FlyingPress không chỉ nhanh hơn WP Rocket với nhiều tính năng hơn mà sau bản cập nhật mới nhất có bổ sung tính năng loại bỏ tình trạng phình to, bạn không cần Perfmatters làm gì nhiều ngoài trình quản lý tập lệnh (để tắt plugin trên các trang cụ thể). Và thậm chí sau đó, bạn có thể sử dụng plugin miễn phí như Asset CleanUp để thực hiện việc này. FlyingPress thực sự đang trở thành plugin tối ưu hóa WordPress tất cả trong một.
Dashboard
Chỉ là một cái nhìn tổng quan với một số tùy chọn thanh lọc/tải trước.
- Purge pages: Các trang HTML được xóa khỏi bộ đệm.
- Preload cache: các trang được lưu trong bộ nhớ đệm sẽ bị ghi đè thay vì xóa toàn bộ bộ đệm.
- Purge pages and preload: Các trang HTML được lọc sạch, sau đó được tải trước.
- Purge everything and preload: giống như cài đặt trước đó, chỉ có điều nó bao gồm mọi thứ.
- Documentation – FlyingPress có tài liệu tuyệt vời. Tải xuống plugin từ trang web FlyingPress và tải nó lên (khóa được đính kèm vào tệp zip và được thêm tự động).
- Facebook community – Nhóm Facebook FlyingPress là một nơi tuyệt vời để duyệt qua các câu hỏi, đặt câu hỏi mới, đưa ra phản hồi cho Gijo và xem các tính năng/bản cập nhật sắp tới.
- Open a ticket – dẫn đến trang liên hệ nơi bạn có thể nhận hỗ trợ (thường là từ chính Gijo). Đây là sự hỗ trợ tốt nhất mà tôi nhận được từ bất kỳ plugin bộ đệm nào, bao gồm cả WP Rocket.
Cache
Bộ nhớ đệm của FlyingPress giờ đây luôn được bật. Nếu bạn đang sử dụng một lớp bộ đệm khác như Nginx, Varnish hoặc APO, FlyingPress sẽ đóng vai trò là bộ đệm dự phòng có thể cải thiện tỷ lệ nhấn bộ đệm. Vì bộ nhớ đệm trang là một lớp khác với các lớp này nên sẽ không có bất kỳ vấn đề tương thích nào.
- Cache logged in users: Off – chỉ bật nếu bạn điều hành một trang web thành viên (hoặc tương tự) và yêu cầu người dùng đăng nhập cần bộ nhớ đệm riêng, nếu không nó yêu cầu tài nguyên máy chủ.
- Scheduled preload: Never – Gijo nói rằng bạn chỉ nên thay đổi nó khi gặp vấn đề với bộ đệm mà nó không được cập nhật kịp thời (bộ đệm sẽ bị ghi đè chứ không bị xóa).
- Exclude Pages from Caching: các trang Thương mại điện tử chính, trang quản trị/đăng nhập và một số trang khác sẽ tự động bị loại khỏi bộ đệm (xem danh sách), nhưng bạn có thể thêm nhiều trang khác tại đây.
- Ignore Query Strings: nếu bạn có các chuỗi truy vấn cần được bỏ qua và không được lưu vào bộ nhớ đệm (tức là các chiến dịch quảng cáo), hãy thêm chúng vào đây. FlyingPress có một danh sách các chuỗi truy vấn mà nó bỏ qua theo mặc định.
- Bypass cookies: có thể làm giảm hiệu suất và không được khuyến khích trừ khi bạn cần.
- Test the cache – kiểm tra trang web của bạn trong uptrends.com và tìm x-flying-press-cache: HIT.
CSS
- Minify CSS: On – tối ưu CSS – bỏ khoảng trắng!
- Remove unused CSS: On – sử dụng FlyingPress hoặc Perfmatters cho việc này chứ không phải WP Rocket (xem phần tải CSS nội tuyến đã sử dụng và tệp riêng biệt). Tải FlyingPress được sử dụng trong một tệp riêng biệt, nhanh hơn cho người dùng nhưng kém hơn một chút về điểm số. Tải WP Rocket sử dụng CSS nội tuyến tốt hơn về điểm số nhưng chậm hơn đối với người dùng thực tế. Perfmatters có một lựa chọn cho cả hai.
- Load unused CSS: remove – tốt nhất cho hiệu suất nhưng yêu cầu loại trừ các tệp nếu chúng làm hỏng trang web của bạn. Xem các loại trừ CSS không được sử dụng phổ biến trong tài liệu Perfmatters dành cho Elementor, Divi và một số tài liệu khác.
- Exclude stylesheets: nếu cài đặt ở trên làm hỏng trang web của bạn, hãy loại trừ các tệp CSS có vấn đề.
- Include selectors: nếu FlyingPress không thể phát hiện một số bộ chọn CSS nhất định để đưa vào CSS đã sử dụng, hãy thêm chúng vào đây. Gijo ban đầu đưa ra ví dụ về bộ chọn CSS thông báo cookie.
- Lazy render elements – tương tự như việc lười tải hình ảnh chỉ cho bất kỳ nội dung nào trên trang web của bạn nếu nó tải dưới màn hình đầu tiên.
JavaScript
- Minify JavaScript: On – nguyên tắc tương tự như việc giảm thiểu CSS chỉ dành cho JavaScript (kết quả kiểm tra).
- Preload links: On for VPS hosting, Off for shared – khi người dùng di chuột qua một liên kết, trang đó sẽ được tải trước nên khi người dùng thực sự nhấp vào liên kết đó, trang đó sẽ tải ngay lập tức. Mặc dù điều này không cải thiện điểm số nhưng nó cải thiện thời gian tải. Nhưng điều đó cũng có nghĩa là nếu người dùng di chuột qua nhiều liên kết (chẳng hạn như trang web WooC Commerce có rất nhiều liên kết hình ảnh), một loạt trang sẽ được tải trước, điều này gây căng thẳng cho máy chủ của bạn. Việc bạn có nên bật tính năng này hay không tùy thuộc vào việc dịch vụ lưu trữ của bạn có đủ mạnh hay không và liệu người dùng của bạn có di chuột qua nhiều liên kết hay không.
- Defer JavaScript: On – có thể sửa lỗi chặn hiển thị bằng cách tải JS không đồng bộ.
- Defer inline: On – nếu bạn đã bật cài đặt trước đó, bạn thường cũng muốn bật cài đặt này.
- Exclude scripts from defer: kiểm tra tab Console trong Công cụ dành cho nhà phát triển Chrome để xem liệu một số tệp JS nhất định có gây ra sự cố khi bị trì hoãn hay không, sau đó loại trừ chúng tại đây nếu cần. “hooks.min.js” và “i18n.min.js” là những loại trừ phổ biến trong tài liệu của Perfmatters.
- Delay JavaScript: Delay all –tốt nhất cho hiệu suất nhưng giống như loại bỏ CSS không sử dụng, bạn sẽ cần loại trừ các tệp. May mắn thay, Perfmatters cũng có các loại trừ độ trễ JS phổ biến. Nếu bạn gặp sự cố, hãy sử dụng “chậm trễ đã chọn” và thêm các tệp JS được tìm thấy theo cách thủ công trong báo cáo “mã bên thứ ba” + “xóa JavaScript không được sử dụng” (xem ảnh chụp màn hình). FlyingPress đã trì hoãn nhiều trong số chúng như Google Analytics và reCAPTCHA, nhưng có thể có những thứ khác. Bạn cũng có thể thử trì hoãn việc tải các plugin dưới màn hình đầu tiên (wp-content/plugins/plugin-name), AdSense (adsbygoogle.js) và GTM (googletagmanager.com). AdSense không bị trì hoãn theo mặc định vì nó có thể ảnh hưởng đến doanh thu của bạn và vì một số người tải nó trong màn hình đầu tiên.
Fonts
- Optimize Google Fonts: On – lưu trữ phông chữ cục bộ (thay vì tạo các yêu cầu bên ngoài tới font.gstatic.com), kết hợp và đưa chúng vào dòng. Điều này không thể thực hiện được đối với các tệp JS của bên thứ ba.
- Display fallback fonts: On – thêm font-display: swap sang CSS để sửa lỗi “đảm bảo văn bản vẫn hiển thị trong khi tải webfont” trong PSI. Cho đến khi phông chữ của bạn được tải, phông chữ dự phòng sẽ được sử dụng để ngăn FOIT (đèn flash của văn bản ẩn), nhưng nó có thể gây ra FOUT (đèn flash của văn bản không được định kiểu).
- Preload fonts: xem các tệp phông chữ trong biểu đồ Thác nước (như GTmetrix) và thử tải trước chúng. Gijo đề nghị chỉ tải trước các phông chữ được đề cập trong tệp CSS và tải các phông chữ trong màn hình đầu tiên. Khi bạn hoàn tất, hãy kiểm tra lỗi tải trước trong tab Bảng điều khiển của Công cụ dành cho nhà phát triển Chrome. Tải trước các phông chữ không được tải là không nên, vì vậy hãy đảm bảo URL chính xác.
Images
- Lazy load images: On – FlyingPress sử dụng tải lười tự nhiên trong khi Perfmatters dựa trên JS. Có các đối số cho cả hai, nhưng chỉ cho phép tải từng phần trong một plugin (tôi sử dụng FlyingPress).
- Exclude above the fold images: Usually 2-3 – đây phải là số lượng hình ảnh thường được tải trong màn hình đầu tiên. Hầu hết các bài đăng của tôi có 3 hình ảnh trong màn hình đầu tiên (xem ảnh chụp màn hình bên dưới) vì vậy tôi đặt nó thành 3. Những hình ảnh này sẽ tự động bị loại khỏi tải chậm và được đặt ở mức ưu tiên cao để có LCP tốt hơn. Bạn cũng có thể loại trừ chúng theo cách thủ công bằng cách thêm URL hình ảnh của chúng.
- Add responsive images using FlyingCDN: On – phân phối hình ảnh nhỏ hơn tới thiết bị di động để có LCP di động tốt hơn khi sử dụng FlyingCDN (sử dụng Trình tối ưu hóa Bunny từ BunnyCDN). Cũng có thể được thực hiện bằng tính năng thay đổi kích thước hình ảnh của Cloudflare, Hình ảnh thích ứng ShortPixel, Optimole.
- Add missing width and height: On – thêm chiều rộng/chiều cao cho hình ảnh để có thể khắc phục lỗi “sử dụng cân nặng và chiều cao rõ ràng” trong PSI. Nếu bạn vẫn gặp lỗi này thì có thể là do CSS hoặc hình ảnh được mã hóa tùy chỉnh. Trong trường hợp này, hãy thêm kích thước theo cách thủ công hoặc chỉ định chúng trong CSS.
- Preload critical images: On – FlyingPress sẽ cố gắng phát hiện các hình ảnh trong màn hình đầu tiên và tải trước chúng để có LCP tốt hơn. Hầu hết các plugin bộ đệm khác thực hiện quy trình này theo cách thủ công.
- Disable emoji: On – xóa một mã JavaScript nhỏ trong WordPress hiển thị biểu tượng cảm xúc.
IFrames
- Lazy load iFrames: On – Các iFrame như video YouTube được nhúng và Google Maps sẽ chỉ được tải khi chúng ở gần chế độ xem, sau đó bị loại trừ khi chúng ở trong chế độ xem.
- Use placeholder image for YouTube iFrames: On – thay thế iFrame của YouTube bằng hình ảnh xem trước và tự lưu trữ hình ảnh giữ chỗ trên YouTube để ngăn các yêu cầu từ bên ngoài tới i.ytimg.com. Điều này cũng có nghĩa là hình thu nhỏ của YouTube có thể được lưu vào bộ nhớ đệm và phân phát từ CDN.
Bloat
Nhiều trong số này trùng lặp với Perfmatters, vì vậy chỉ bật cài đặt trùng lặp trong 1 plugin.
- Remove Google Fonts: Off – chỉ sử dụng nếu bạn đang trong quá trình sử dụng phông chữ hệ thống hoặc phông chữ tùy chỉnh và cần tắt chúng. Nếu không, nó sẽ xóa Google Fonts khỏi trang web.
- Disable XML-RPC: On – kém về tốc độ + bảo mật (dùng để xuất bản nội dung từ thiết bị di động).
- Disable RSS feed: Off – bạn sẽ chỉ bật tính năng này nếu trang web của bạn không có blog.
- Disable Block editor CSS: Off – nếu bạn đang sử dụng Gutenberg, hãy bỏ nó đi. Thay vào đó, nếu bạn đang sử dụng trình tạo trang, hãy bật tính năng này. Điều này ngăn không cho tệp CSS tải trên trang web của bạn.
- Disable oEmbeds: On – khi bạn dán URL vào trình chỉnh sửa WordPress của mình, thao tác này sẽ tải một bản xem trước đẹp mắt (từ YouTube, Facebook, Tweets, v.v.). Nếu bạn không cần cái này, hãy bật nó lên.
- Disable Emojis: On – xóa tệp JavaScript cần thiết cho biểu tượng cảm xúc (thay vào đó hãy sử dụng Unicode).
- Disable WP Cron: Off – cách dễ dàng để vô hiệu hóa wp-cron, sau đó bạn sẽ thêm một công việc định kỳ thực sự (xem hướng dẫn lưu trữ của bạn) để có thể giảm mức sử dụng CPU. Trong trường hợp đó, hãy bật tính năng này.
- Disable jQuery Migrate: Off – nếu bạn không sử dụng trình tạo trang, hãy bật nó lên. Perfmatters có tài liệu về cách xử lý jQuery trong trình quản lý tập lệnh, cài đặt trì hoãn, trì hoãn và tải trước.
- Disable Dashicons: On – ngăn các biểu tượng quản trị viên tải tệp CSS trên giao diện người dùng.
- Control Post Revisions: 5 or 10 – điều này cung cấp cho bạn đủ các bản sửa đổi mà nếu bạn cần một bản sao lưu, bạn có một vài bản để chọn, nhưng vẫn ngăn chúng thêm quá nhiều.
- Control Heartbeat: Enable only while editing posts for 60s – cũng được Perfmatters khuyến nghị (đặc biệt nếu sử dụng trình tạo trang) để tắt tính năng này trừ khi bạn đang chỉnh sửa nội dung.
CDN
Nếu bạn làm web Việt Nam thì mình khuyên không nên sử dụng CDN mà thay vào đó hãy chọn một hosting tốt. Vì vậy phần này mình bỏ qua và sẽ nói ở một bài viết khác.
Ok! Như vậy là các bạn đã biết cách sử dụng plugin FlyingPress, plugin cache tốt nhất hiện nay.
Kết luận
Tóm lại, FlyingPress đã khẳng định vị trí đáng kể của mình trong thế giới plugin cache với khả năng tối ưu hóa tốc độ trang web đáng kinh ngạc. Sự xuất sắc của nó không chỉ phụ thuộc vào việc sử dụng LiteSpeed Server, mà còn dựa trên việc tận dụng thông minh tài nguyên và triển khai cache một cách thông minh. Điều này chứng tỏ rằng FlyingPress là một giải pháp ưu việt không chỉ cho máy chủ LiteSpeed mà còn cho nhiều loại máy chủ khác. Sẵn sàng đối mặt với các thách thức về tốc độ và tối ưu hóa, FlyingPress đích thực là một lựa chọn đáng xem xét trong việc cải thiện hiệu suất trang web.
