Tối ưu tốc độ website wordpress phần 1

Đăng bởi Nguyên Vũ vào 2019-09-21T16:05:21.472Z

Trước khi đọc, hãy nắm rõ mục tiêu của bài viết: cung cấp cho bạn thông tin tại sao nên chọn wordpress ở thời điểm 2019, đặc biệt tại sao tốc độ là yếu tố được nâng lên hàng đầu khi sử dụng stack này. Series bài viết sẽ được chia thành 3 phần chính: trong phần đầu này, chúng ta cần biết về lý thuyết tối ưu tốc độ trước khi đến với kỹ thuật cụ thể.

 

Bài viết có sử dụng một số từ ngữ chuyên môn, nếu gặp khó khăn trong quá trình đọc, đừng ngần ngại hỏi Stream Hub nhé.

 

Chút ít về “lịch sử” Wordpress và cách tốc độ trở thành thứ tiên quyết

Cái hồi mà website WordPress chạy nhanh chỉ với một server Apache và PHP? Chính xác là những ngày huy hoàng đó đấy. Nhờ chúng, mọi thứ đã trở nên bớt phức tạp hơn rất nhiều sau này.

 

Bây giờ thì mọi thứ đều phải chạy thật nhanh mới được. Khách tham quan trang web bây giờ không có thời gian chờ đợi chạy trang như hồi trước đâu. Một website chạy chậm có thể tạo ảnh hưởng rất xấu đến bạn và cả khách hàng của bạn.

 

Vì nhu cầu nâng cao tốc độ chạy trang, server stack WordPress bị buộc phải tiến hóa qua từng năm để theo kịp thời đại. Trong khoảng thời gian “tiến hóa” đó, một số tính năng mới đã được thêm vào bộ máy và đồng thời các tính năng cũ cũng bị chỉnh sửa hàng loạt.

 

Và kết quả là WordPress hiện nay trông khác biệt hẳn so với những năm trước, còn việc nó khác như nào thì chúng ta phải cùng tìm hiểu sâu hơn mới có thể nắm rõ được. Sau đây bạn sẽ thấy “cách lắp ráp” như thế nào thì có thể khiến một trang website WordPress chạy nhanh.

 

Làm thế nào để tăng tốc độ load web

Trước khi tiến sâu vào vấn đề, bạn hãy zoom tấm ảnh to ra và nhìn cho kĩ. Đây chính là câu trả lời cho “hình dáng” của Server stack WordPress:

 

cau truc wp

 

Sơ đồ phía trên cho chúng ta một cái nhìn khái quát về hình dạng của WordPress. Nhìn chung thì ta có thể chia những gì đang diễn ra thành ba khu vực:

  • Vòng tuần hoàn yêu cầu – phản hồi giữa trình duyệt và WordPress.
  • WordPress
  • Vòng tuần hoàn nghi vấn – kết quả giữa WordPress và cơ sở dữ liệu MySQL.

 

Vai trò của WordPress bản hiện đại là tối ưu hóa ba khu vực này. Nhờ sự tối ưu hóa đó mà tốc độ load được nâng cao hơn rất nhiều và điều tuyệt vời nhất ở đây là có khá nhiều cách để làm điều đó.

 

Trong nhiều trường hợp, việc tối ưu hóa này bao gồm cả việc cài đặt những dịch vụ mới trên server của bạn. Đôi khi mấy cái dịch vụ này sẽ cần sự giúp đỡ của plugin để có thể tương tác với WordPress và đôi khi bạn có thể thoát ra chỉ bằng việc cài đặt một cái plugin. Bạn sẽ thấy rất nhiều lựa chọn qua bài viết ngày hôm nay.

 

Vòng tuần hoàn yêu cầu – phản hồi

Mọi chuyện bắt đầu từ trình duyệt. Hãy nói bạn muốn xem trang chủ của wordpress.org. Trình duyệt của bạn sẽ khởi động bằng việc gửi một yêu cầu HTTP đến server web làm chủ nó. Trong một kết thúc khác, server web sẽ lấy yêu cầu của bạn rồi biến nó thành một cái phản hồi HTTP.

 

Phản hồi đầu tiên sẽ luôn là nội dung HTML của trang chủ modern.wordpress-stack.org  (trừ  khi xảy ra lỗi). Tuy nhiên, công việc của trình duyệt chưa dừng lại tại đây. Trang chủ đó vẫn cần thêm nhiều tệp tin nữa, mấy tệp đó phần lớn là CSS, JavaScript và tệp hình ảnh.

Vậy nên, trình duyệt sẽ gửi yêu cầu đòi thêm mấy loại tệp này, sau đó server web sẽ phản hồi lại bằng những tệp được yêu cầu (miễn là không xảy ra lỗi). Vòng tuần hoàn này luôn tiếp tục cho đến khi trình duyệt đã có đủ thông tin để render trang chủ. Vòng tuần hoàn này diễn ra càng nhanh thì website của bạn load càng nhanh.

Cả quá trình diễn ra đều đã được đơn giản hóa lại, nhưng về cơ bản đây chính là cách mà phần lớn các website WordPress vận hành.

 

Tối ưu hóa vòng tuần hoàn yêu cầu – phản hồi

Câu hỏi hiển nhiên mà ai cũng thắc mắc sau khi đọc qua nội dung trên: Làm thế nào để web server thực hiện vòng tuần hoàn này nhanh hơn? Đây là một câu hỏi hay và nó cũng là một phần lí do tại sao server stack WordPress bản hiện đại xuất hiện.

 

Stack này xuất hiện chỉ đơn giản vì bạn không thể làm server web chạy nhanh hơn được. Server web cũng là một bộ phận điều phối. Nó có thể nhận yêu cầu và chuyển tiếp yêu cầu đó tới các dịch vụ khác.

 

Những dịch vụ khác này thường là “nút kẹt” làm chậm vòng tuần hoàn yêu cầu – phản hồi. Với WordPress, nút kẹt này là PHP – cũng là lí do vì sao việc tối ưu hóa vòng tuần hoàn kia có thể được giải thích bằng hai thứ. Chúng ta muốn web server:

  1. Nhận ít yêu cầu nhất có thể.
  2. Chuyển tiếp ít yêu cầu nhất có thể.

 

Server stack WordPress ở những cập nhật mới đây tập trung vào cái thứ hai: Chuyển tiếp ít yêu cầu nhất có thể. Nó muốn chuyển tiếp yêu cầu đến PHP ít nhất có thể. Đây chính là mục tiêu chính của việc tối ưu hóa stack này.

 

Chúng ta tập trung vào mục tiêu thứ hai vì stack không thể làm gì nhiều đối với cái đầu, nó không tạo ra bất kì ảnh hưởng trực tiếp nào. Cái thứ hai có thể được xác định bằng cấu hình của web server hay dùng phương pháp phát triển hiện đại.

 

Tăng tốc độ load website bằng giảm tuần hoàn yêu cầu – phản hồi

Vậy thì những yếu tố cần thiết cho việc giảm lượng yêu cầu chuyển tới PHP? Câu trả lời chính là: Server web và HTTP cache.

Server Web

Chúng ta đã nói khá nhiều về server web gần đây. Có ba thành phần chủ chốt trong không gian server web:

  1. Apache
  2. Internet Information Services (IIS)
  3. nginx

Những thứ này cùng nhau chiếm hết 90% thị trường server web trên Internet. Chúng ta sẽ tập trung vào Apache và nginx. IIS có thể được dùng để chạy WordPress nhưng nó không phổ biến vì nó chỉ áp dụng được với Windows, trong khi đa số server WordPress dùng Linux.

 

Nginx vs Apache wordpress

Vậy nên những gì chúng ta còn lại là Apache và nginx. Apache đã luôn là server web điển hình duy trì toàn bộ “cuộc sống” của WordPress. Chúng ta có stack LAMP (viết tắt cho Linux, Apache, MySQL và PHP) – hỗ trợ chạy WordPress trên cả máy tính và server.

Nhưng sau cánh gà thì mọi thứ đều thay đổi: Thị trường web tiếp cận một nhân tố mới – nginx. Automattic và WordPress.com đã luôn sử dụng nó kể từ 2008 và nó là server web chạy được nhiều website có lượng traffic cao nhất (phần lớn những trang web này chạy WordPress). Điều này giải thích cho việc rất nhiều công ty chủ cao cấp và tổ chức WordPress dùng nó như web server của họ.

 

apache vs nginx

Nguồn: w3techs

 

Không phải vì Apache là một server web tệ, thực sự thì có rất nhiều chuyên gia Apache đã khiến nó chạy một lượng lớn traffic mà không gặp trục trặc. Vấn đề ở đây chỉ là nó không thể làm tốt trong giới hạn hay cấu hình tiêu chuẩn của WordPress.

Trong khi đó, mục đích duy nhất của nginx chỉ đơn thuần là xử lí một lượng lớn traffic. 

Một trong những lí do mà nginx có thể xử lí lượng traffic lớn tốt hơn là vì nó dùng FastCGI để kết nối thông tin với PHP. FastCGI là gì? Nó là một giao thức cho phép PHP hoạt động như một dịch vụ riêng biệt tách khỏi server web.

Apache không mặc định tự làm việc này. Mỗi khi server web nhận được yêu cầu, nó cần phải khởi động quá trình thời gian chạy PHP – kể cả hình ảnh, JavaScript và CSS. Điều này giảm số lượng yêu cầu mà server có thể xử lí và giảm cả tốc độ xử lí của nó luôn.

Việc này đối nghịch với một trong những tiêu chí của server stack WordPress hiện đại mà chúng ta đã thấy lúc trước: Stack cần phải giữ cho thời gian diễn ra vòng tuần hoàn yêu cầu – phản hồi thấp nhất có thể. Load PHP cho mỗi yêu cầu kể cả khi không cần thiết là đi ngược lại tiêu chí này. Vậy nên nếu bạn dùng Apache, hãy kiểm tra FastCGI.

Tìm hiểu thêm về Nginx tại bài viết Nginx là gì.

 

HTTP/2

HTTP/2 là một tính năng server web quan trọng khác mà bạn nên biết. Nó là phiên bản tiếp theo của HTTP, giao thức giúp vận hành toàn bộ vòng tuần hoàn yêu cầu – phản hồi của chúng ta.

Trước sự xuất hiện của HTTP/2, một trình duyệt chỉ có thể sở hữu tổng cộng sáu kết nối tới server web và mỗi kết nối chỉ có thể xử lí duy nhất một yêu cầu tại một thời điểm. Nói tóm lại, trong thực tế, mỗi một vòng tuần hoàn yêu cầu – phản hồi chỉ phủ đầu được tối đa sáu yêu cầu.

Đây chính là vấn đề thực sự vì phần lớn website đều có hàng tá yêu cầu trong vòng tuần hoàn của họ. May mắn là, developer (Lập trình viên) và system administrators (người quản lí hệ thống) đã tìm ra những con đường thông minh khác để vượt qua giới hạn này.

Một trong những cách giải quyết nổi tiếng là phối hợp hai loại tệp CSS và JavaScript. Nhìn từ bối cảnh lí tưởng thì, chuyện này sẽ giảm tổng số yêu cầu đòi tệp CSS và JavaScript xuống còn hai: Một cho JavaScript và một cho CSS.

Nhưng công việc này là không cần thiết với HTTP/2 vì HTTP/2 cho phép một lượng yêu cầu không giới hạn cho mỗi cổng kết nối. Cũng nhờ chức năng này mà tất cả yêu cầu thêm vào sau phản hồi HTML ban đầu đều có thể xảy ra cùng một lúc.

Chuyện này có ý nghĩa rất lớn đối với hiệu suất làm việc. Một lượng lớn công việc tối ưu hóa server stack tập trung vào vòng tuần hoàn yêu cầu – phản hồi này. Nhờ việc giảm số lượng vòng tuần hoàn xuống một con số nhỏ, HTTP/2 đã hoàn thành một núi việc khổng lồ cho chúng ta.

 

HTTP Cache

Phần quan trọng nhất của server stack WordPress là HTTP cache. Trong thế giới WordPress, chúng ta cũng có thể gọi nó là page caching. Mục đích của HTTP cache là cache lại những yêu cầu và phản hồi. Điều này có ý nghĩa gì?

Được rồi, hãy trở lại với ví dụ trước đó: Trình duyệt gửi một yêu cầu trang chủ của  modern.wordpress-stack.org, và server web nhận yêu cầu đó xong rồi chuyển tiếp nó tới PHP.

Vấn đề xảy ra trong tình huống này là server web khá… ngu. Nó sẽ luôn chuyển tiếp toàn bộ yêu cầu nó nhận được tới PHP – kể cả khi phần lớn yêu cầu đều đem lại một phản hồi giống nhau.

Đó là vấn đề thực sự xảy ra khi khách tham quan không đăng nhập. Với server web, tất cả chúng đều là những yêu cầu khác nhau. Nó sẽ chuyển tiếp toàn bộ chúng tới PHP, mà việc này sau đó chỉ đem lại một phản hồi y chang.

Chuyện này thật tồi tệ! Như ta có thể thấy trước đó, PHP chính là một cái nút kẹt thực sự cho vòng tuần hoàn yêu cầu – phản hồi của chúng ta. Trình duyệt của bạn không thể gửi các yêu cầu tiếp theo cho tới khi nó nhận được phản hồi trang chủ ban đầu kia. Chúng ta không thể mặc định bắt server web chuyển tiếp mọi thứ tới PHP.

Từ đây ta có HTTP cache – nó sẽ ngồi giữa server web và PHP sau đó kiểm tra mỗi yêu cầu mà server web nhận được rồi tìm một phản hồi vốn được cache sẵn. Nếu không có sẵn phản hồi nào, HTTP cache sẽ chuyển tiếp yêu cầu cho PHP và cache lại phản hồi mà PHP tạo ra.

Nhờ có HTTP cache mà thời gian diễn ra vòng tuần hoàn giảm xuống rất nhiều, giúp website load nhanh hơn. Nó cũng giúp server web xử lí đồng thời nhiều yêu cầu mà không bị quá tải.

Rất nhiều người khi đọc đến đây đều tự hỏi cách để tải HTTP cache về. Vì thế chúng ta có một tin vui: Cài đặt HTTP cache trên một server WordPress thực ra rất dễ dàng, thậm chí còn có cả một danh sách các cách tải.

 

Vậy là bạn đã hiểu được về cấu trúc sơ khai của Wordpress và những yếu tố giúp nền tảng này chạy nhanh rồi. Ở bài viết tiếp theo chúng ta sẽ cùng hiện thực hoá nó nhé.


Có thể bạn quan tâm