Tối ưu hoá đường dẫn kết xuất quan trọng

Ilya Grigorik
Ilya Grigorik

Để cung cấp thời gian nhanh nhất có thể để hiển thị lần đầu tiên, chúng ta cần giảm thiểu 3 biến:

  • Số lượng tài nguyên quan trọng.
  • Độ dài lộ trình quan trọng.
  • Số byte quan trọng.

Tài nguyên quan trọng là tài nguyên có thể chặn hiển thị ban đầu của trang. Càng ít các tài nguyên này thì càng ít công việc cho trình duyệt, CPU và các tài nguyên khác.

Tương tự, độ dài đường dẫn quan trọng là một hàm của đồ thị phần phụ thuộc giữa các tài nguyên quan trọng và kích thước byte của chúng: một số lượt tải xuống tài nguyên chỉ có thể được bắt đầu sau khi tài nguyên trước đó đã được xử lý và tài nguyên càng lớn thì càng mất nhiều trọn vòng để tải xuống.

Cuối cùng, trình duyệt phải tải xuống càng ít byte quan trọng, thì trình duyệt càng có thể xử lý và hiển thị nội dung trên màn hình nhanh hơn. Để giảm số lượng byte, chúng ta có thể giảm số lượng tài nguyên (loại bỏ chúng hoặc làm cho chúng không quan trọng) và đảm bảo rằng chúng ta giảm thiểu dung lượng truyền bằng cách nén và tối ưu hoá từng tài nguyên.

Trình tự chung các bước để tối ưu hoá đường dẫn hiển thị quan trọng là:

  1. Phân tích và mô tả đường dẫn quan trọng của bạn: số lượng tài nguyên, byte, độ dài.
  2. Giảm thiểu số lượng tài nguyên quan trọng: loại bỏ chúng, trì hoãn quá trình tải xuống, đánh dấu chúng là không đồng bộ, v.v.
  3. Tối ưu hoá số lượng byte quan trọng để giảm thời gian tải xuống (số lượng trọn vòng).
  4. Tối ưu hoá thứ tự tải các tài nguyên quan trọng còn lại: tải tất cả các tài sản quan trọng xuống càng sớm càng tốt để rút ngắn chiều dài lộ trình quan trọng.

Ý kiến phản hồi