Kỹ Thuật Tối Ưu Hoá Tốc Độ Tải Của Trang Web

Chọn Server Ở Địa Điểm Hợp Lý

Server là một thành phần quan trọng trong việc tăng tốc độ tải website. Nếu bạn sử dụng một server chậm với giá rẻ để host trang web của bạn thì dù bạn có sử dụng các kỹ thuật tối ưu hoá tốc độ của website tới đâu thì trang web của bạn vẫn chậm. Chính vì vậy việc đầu tiên bạn cần phải làm đó là chọn một máy chủ được đặt ở địa điểm hợp lý. Bạn lưu ý server có địa điểm hợp lý không nhất thiết phải là server nằm gần nhà bạn mà gần nhà những người hay truy cập website. Nếu bạn đang ở Hà Nội trong khi người dùng trang web bạn tạo ra lại chủ yếu ở Tp.Hồ Chí Minh thì bạn nên đặt server ở Tp.Hồ Chí Minh.

Sử Dụng Content Delivery Network

Content Delivery Network (viết tắt là CDN) là một tập hợp các máy chủ được dùng để chia sẻ các thư viện mã nguồn mở (các thư viện này được sử dụng phổ biến ở nhiều trang web trên thế giới). Đặc điểm của các server CDN là chúng được đặt ở rất nhiều địa điểm khác nhau và khi sử dụng thư viện được host trên CDN thì thư viện sẽ được tải về từ máy chủ gần với địa điểm của máy khách nhất. Ví dụ khi bạn đang ở Việt Nam và bạn mở trình duyệt lên truy cập trang Facebook, trang Facebook trả về một trang mã lệnh HTML trong đó có chứa tham chiếu tới một thư viện jQuery và nguồn của thư viện này sử dụng một địa chỉ được cung cấp bởi CDN của Google như sau:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

Khi đó máy tính của bạn sẽ tải thư viện này từ máy chủ CDN của Google gần nhất đó là 1 máy chủ đặt ở Singapore.

Minify Các Tập Tin CSS và Javascript

Minify mã lệnh là kỹ thuật dùng để giảm tối đa dung lượng của các tập tin giúp chúng được tải về máy khách nhanh hơn. Ví dụ bạn có một tập tin Javascript như sau:

// Năm hiện tại
var nam_nay_la_nam = 2016;
// Năm kế tiếp
var nam_tiep_theo_la_nam = nam_nay_la_nam + 1;

Thì sau khi minify đoạn mã trên sẽ có nội dung như sau:

var a=2016;var b=a+1;

Ở đây các tên biến được thay đổi thành tên ngắn hơn, các đoạn chú thích cũng được xoá đi và khoảng trắng không cần thiết cũng được loại bỏ để giảm kích thước cho tập tin.

Nén Hình Ảnh

Nén (hay compress) hình ảnh là một kỹ thuật dùng để giảm kích cỡ hình ảnh giúp việc tải ảnh về được diễn ra nhanh hơn. Các ảnh thường phải nén bao gồm ảnh có ảnh từ độ phân giải cao (như PNG) về ảnh có độ phân giải thấp hơn (như JPEG), ảnh có kích thước lớn chuyển về ảnh có kích thước nhỏ hơn có cùng tỷ lệ chiều dài x chiều rộng....

Bạn có thể nén ảnh sử dụng các công cụ chỉnh sửa ảnh như Photoshop. Ngoài ra, đối với các website mà nội dung được tạo bởi người dùng (ví dụ như các mạng xã hội như Facebook hay 9Gag) việc nén ảnh đặc biệt quan trọng. Với các website này thì lập trình viên cần phải viết mã lệnh sao cho ảnh được nén một cách tự động khi người dùng tải ảnh lên. Tuy nhiên, hầu hết tất cả các ngôn ngữ lập trình đều cung cấp các thư viện giúp bạn làm được công việc nén ảnh này.

Gộp Các Tập Tin Javascript, CSS... Được Tham Chiếu Trên Cùng Một Trang

Một yếu tố khiến trang web của bạn chạy châm đó là trang HTML của website sau khi được trình duyệt tải về lại có quá nhiều tham chiếu tới các tập tin Javscript hay CSS khác khiến trình duyệt lại phải tiếp tục tải về các tập tin này trước khi kết thúc quá trình hiện thị trang cho người dùng.

Chính vì vậy khi trang web có nhiều tập tin thì bạn cần gộp nội dung các tập tin này lại thành một tập tin duy nhất để giảm thiểu việc trình duyệt phải gửi nhiều request khác nhau lên máy chủ.

Caching

Đây cũng là một kỹ thuật quan trọng đặc biệt hữu dụng khi trang web của bạn có lưu lượng truy cập lớn. Kỹ thuật caching không phức tạp như nhiều người lầm tưởng. Trước hết bạn lưu ý kỹ thuật này được áp dụng trên các website động có nội dung được cung cấp bởi một cơ sở dữ liệu như (MySQL) thay vì các trang thuần tuý HTML. Nguyên lý hoạt động của nó rất đơn giản đó là lưu lại nội dung các trang HTML (được tạo ra sau khi gọi truy vấn tới cơ sở dữ liệu) có nội dung ít thay đổi nhưng được truy cập nhiều. Ví dụ một trang trên website hoclaptrinh.org bao gồm danh sách các khoá học như sau:

http://hoclaptrinh.org/khoa-hoc

Khi người dùng đầu tiên truy cập vào địa chỉ trên, máy chủ sẽ truy vấn tới cơ sở dữ liệu để tìm danh sách các khoá học được tạo ra. Sau đó dựa trên kết quả dữ liệu trả về từ cơ sở dữ liệu, máy chủ sẽ tạo ra trang HTML tương ứng để trả về cho người dùng.

Tuy nhiên vì danh sách các khoá học này ít thay đổi nên sẽ hợp lý hơn khi chúng ta lưu lại kết quả trả về cho người dùng thứ nhất để sử dụng cho những người dùng tiếp theo. Làm như vậy sẽ tránh được việc phải truy vấn tới cơ sở dữ liệu nhiều lần mà chỉ việc trả về ngay trang HTML đã được cached trước đó.