AccelerateWP là gì?
AccelerateWP là một giải pháp phức tạp giúp khách hàng tăng hiệu suất trang web WordPress của họ. Với AccelerateWP, bạn có thể quản lý các tính năng tối ưu hóa, như bộ nhớ cache đối tượng, tiền xử lý CSS và JavaScript, và tải trước trang web.
Để bắt đầu sử dụng AccelerateWP, hãy truy cập giao diện cPanel và tìm ứng dụng AccelerateWP trong phần Phần mềm.
Nhấp vào nút ứng dụng và truy cập vào giao diện AccelerateWP.
Mỗi hàng trong bảng đại diện cho trang web WordPress được tìm thấy trên máy chủ và mỗi cột đại diện cho tính năng tối ưu hóa.
AccelerateWP được xây dựng dựa trên hướng dẫn: tính năng được đề xuất để kích hoạt khi Smart Advice được phát ra. Smart Advice có thể được phát ra trong quá trình phân tích một trang web bằng X-Ray. X-Ray PHP profiler phát hiện các hạn chế cụ thể trong hiệu suất trang web và do đó có khả năng chọn một tính năng tối ưu hóa phù hợp nhất để tăng hiệu suất một cách đáng kể.
Sử dụng liên kết Advice available để kiểm tra chi tiết hướng dẫn và nhấp vào nút Apply advice để kích hoạt tính năng.
Sau vài phút, tính năng sẽ được kích hoạt và hướng dẫn sẽ chuyển sang Trạng thái: Applied. Đóng cửa sổ và xem liên kết Active trong ô tương ứng của bảng.
Nếu bạn vẫn muốn thử tính năng trên trang web mà không có hướng dẫn, hãy nhấp vào biểu tượng bánh răng và kích hoạt tính năng.
Tính năng AccelerateWP: Plugin tối ưu hóa WordPress
AccelerateWP là một tính năng cơ bản cung cấp bộ nhớ cache toàn trang, nén GZIP và một số tối ưu hóa hữu ích khác.
Để bắt đầu làm việc với tính năng AccelerateWP, hãy kiểm tra xem hướng dẫn có sẵn trong ô tương ứng tại giao điểm của trang web và cột AccelerateWP.
Và nhấp vào nút Apply advice để kích hoạt tính năng AccelerateWP.
Sau vài phút, plugin sẽ được cài đặt. Đăng nhập vào WordPress Admin và tìm AccelerateWP trong danh sách các plugin đang hoạt động.
Bộ nhớ cache trang sẽ được kích hoạt mặc định. Nhấp vào liên kết “Settings” phía dưới tên plugin để cấu hình các tùy chọn bổ sung.
Giới hạn
- Trang web phải sử dụng phiên bản PHP 7.2 trở lên.
- Phiên bản WordPress phải là 5.6 trở lên.
- Không được cài đặt bất kỳ plugin tạo bộ nhớ cache WordPress nào khác.
- WordPress không nên chạy ở chế độ Multisite.
Các tùy chọn bổ sung của tính năng AccelerateWP
Tìm thêm các tùy chọn bổ sung trong trang quản lý WordPress.
1. Mobile caching
Chỉ sử dụng nó nếu trang web của bạn đã được điều chỉnh để sử dụng trên điện thoại thông minh và điện thoại di động.
Tách các tệp cache riêng cho thiết bị di động. Trong trường hợp này, nội dung cho thiết bị di động sẽ được lưu vào các tệp cache khác nhau so với máy tính để bàn/bảng.
Tùy chọn này là cần thiết nếu bạn có một số chức năng chỉ dành riêng cho thiết bị di động, không dành cho máy tính để bàn/bảng.
Sơ đồ sau đây sẽ giúp bạn hiểu liệu bạn cần lưu cache cho thiết bị di động hay không.
Chú ý: Nếu bạn sử dụng một lớp Cache bổ sung (Varnish, NGINX, vv.), hãy đảm bảo nó có thể phân biệt giữa khách truy cập từ máy tính và thiết bị di động.
2. User Cache
Đề nghị sử dụng tùy chọn này khi trang web của bạn có nội dung duy nhất cho từng người dùng đã đăng nhập. Nếu người dùng chưa đăng nhập, sẽ sử dụng cache chung của trang web, còn nếu người dùng đã đăng nhập, nội dung riêng của từng người dùng sẽ được lưu cache một cách riêng biệt.
3. File Optimization
Tối ưu hóa tệp bao gồm việc thu nhỏ và kết hợp tệp.
Thu nhỏ là quá trình giảm thiểu mã trong trang web và tệp script của bạn. Nhà quản trị trang web coi việc thu nhỏ là phương pháp chính để giảm thời gian tải trang web thông qua băng thông sử dụng.
Thu nhỏ cũng giảm kích thước các tệp JS, CSS và HTML. Mục tiêu là loại bỏ các comment và khoảng trắng dư thừa. Nó làm giảm biến số để tối thiểu hóa mã và giảm kích thước tệp.
Sau khi thu nhỏ, tệp vẫn hoạt động như bình thường. Sự khác biệt là giảm băng thông do các yêu cầu mạng.
Bằng cách kết hợp các tệp CSS và JS, HTTP/1 không cho phép nhiều yêu cầu từ cùng một kết nối TCP giữa máy chủ và trình duyệt web.
Đặt tệp CSS và JS vào các nhóm tương ứng của chúng, yêu cầu tải xuống từ trình duyệt trở nên an toàn và hiệu quả hơn. Cách cũ đòi hỏi nhiều kết nối tốn băng thông.
Kết hợp tệp (CSS & JS) không cần thiết cho HTTP/2 (xem https://webspeedtools.com/should-i-combine-css-js/).
HTTP/2 giới thiệu việc kết hợp nhiều luồng. Bây giờ, trình duyệt có thể gửi số lượng yêu cầu không giới hạn tới máy chủ, sau đó tải xuống tất cả các tệp đồng thời chỉ với một kết nối TCP.
Do đó, HTTP/2 quản lý nhiều kết nối TCP và thời gian chờ trước mỗi tải xuống. Một mặt khác, việc kết hợp các tệp CSS và JS có thể là không cần thiết.
Để xác minh phiên bản HTTP được sử dụng cho các yêu cầu trên trang web của bạn, bạn có thể sử dụng https://tools.keycdn.com/http2-test
4. CSS Files
4.1. Minify CSS (Thu nhỏ CSS)
Thu nhỏ CSS giảm kích thước tệp bằng cách loại bỏ khoảng trắng và các comment trong mã.
4.2. Combine CSS (Kết hợp CSS)
Kết hợp CSS giảm số lượng yêu cầu HTTP bằng cách gộp tất cả các tệp của bạn thành một tệp duy nhất. Tuy nhiên, không khuyến nghị sử dụng kết hợp CSS nếu trang web của bạn sử dụng HTTP/2.
4.3. Excluded CSS Files (Các css bị loại trừ)
Để định rõ các tệp CSS không nên được thu nhỏ, hãy liệt kê các URL đính kèm với các tệp CSS mà không nên được thu nhỏ và kết hợp (mỗi URL trên một dòng).
Lưu ý: Quá trình thu nhỏ sẽ xóa tên miền khỏi URL.
Để ngăn chặn điều đó, sử dụng wildcards (.) trong (.)CSS để loại trừ tất cả các tệp trong một vị trí cụ thể.
Bên thứ ba: khi loại trừ các tệp CSS bên ngoài, hãy sử dụng tên miền hoặc đường dẫn URL đầy đủ.
4.4. Optimize CSS delivery (Critical Path CSS) (Tối ưu hóa việc cung cấp CSS (Critical Path CSS))
Critical Path CSS loại bỏ CSS chặn quá trình hiển thị trên trang web của bạn và cải thiện hiệu suất hiển thị trang của trình duyệt. Trang web của bạn sẽ tải nhanh hơn đáng kể đối với khách truy cập của bạn.
Lưu ý: Tính năng này chỉ có thể được kích hoạt trong giao diện bảng điều khiển héo tăng tốc WP hoặc trong plugin SmartAdvice WordPress. Sau khi kích hoạt, bạn sẽ có thể quản lý các tùy chọn trong plugin AccelerateWP WordPress.
Chức năng này sẽ tự động bắt đầu sau khi được bật. Nó mất một thời gian để tạo ra Critical CSS. Bạn sẽ nhận được thông báo về trạng thái quá trình tạo. Nếu cần, bạn có thể thêm các kiểu dáng bổ sung vào trường CSS dự phòng của Critical CSS.
Mỗi khi bạn thay đổi chủ đề của trang web, Critical CSS sẽ được tạo lại. Ngoài ra, nếu bạn đã thay đổi bất kỳ kiểu dáng nào của trang web, bạn cần tạo lại Critical CSS bằng cách nhấp vào nút “Regenerate critical CSS” một cách thủ công.
5. JavaScript Files
5.1. Minify javascript files (Thu nhỏ tệp JavaScript)
Thu nhỏ JavaScript loại bỏ khoảng trắng và các comment để giảm kích thước tệp.
5.2. Combine JavaScripts files (Kết hợp các tệp JavaScript)
Tùy chọn này chỉ hoạt động nếu bạn chọn Thu nhỏ tệp JavaScript. Không khuyến nghị sử dụng cho HTTP2.
5.3. Load JavaScript deferred (Tải JavaScript theo sau (defer))
Một nguyên nhân chính gây chậm trang web là việc sử dụng mã script gọi là blocking script: https://www.dummies.com/web-design-development/javascript/deferred-loading-with-javascript/.
Việc tải JavaScript gọi là blocking script chặn trang web khỏi việc tải.
Sử dụng thuộc tính defer sẽ thông báo cho trình duyệt không chờ đợi mã script. Mọi thứ sẽ tiếp tục như thông thường theo quy trình xây dựng HTML và DOM. Mã script yên lặng nằm ở nền, sau đó chạy sau khi DOM được xây dựng.
Do đó, tùy chọn Tải JavaScript theo sau thêm thuộc tính defer vào mỗi thẻ script.
5.4. Delay JavaScript Execution
Tùy chọn này giúp giảm thời gian tải trang bằng cách trì hoãn việc tải tất cả các tệp JavaScript trên trang. Tùy chọn này chỉ áp dụng cho các trang đã được lưu cache, nó không tương thích với tùy chọn Kết hợp các tệp JavaScript.
6. Media
6.1. LazyLoad
LazyLoad ảnh hưởng đến trang web theo cách sau – nếu người dùng mở trang web lần đầu tiên, chỉ có những hình ảnh được hiển thị đầu tiên (hiển thị cho người dùng), các hình ảnh khác sẽ được tải khi người dùng cuộn xuống. Các hình ảnh được thêm qua tệp CSS, thẻ