Giữ số lượng yêu cầu thấp và kích cỡ tải về nhỏ

Lighthouse lập báo cáo cung cấp thông tin có bao nhiêu yêu cầu mạng (network requests) được tạo ra và bao nhiêu dữ liệu được lưu chuyển (data was transferred) trong khi trang của bạn tải về: Số lượng yêu cầu (Request) và Kích cỡ lưu chuyển (Transfer Size) cho hàng Total (tổng số) được tính toán bằng cách cộng giá trị của các hàng Ảnh (Image), JavaScript (Script), Font (chữ), Stylesheet (CSS), Các cái khác (Other), Tài liệu (Document), và Tài nguyên đa phương tiện (Media). Cột Third-party không được tính giá trị vào hàng Total. Mục đích là …

Đọc thêm

Tối ưu kích thước ảnh để tăng tốc website

Khu vực cơ hội của Lighthouse báo cáo danh sách tất cả các ảnh trên trang của bạn không có kích thước ảnh tối ưu, cùng với tiềm năng tiết kiệm tính theo kilobyte (KB). Thay đổi kích cỡ các ảnh này giúp bạn tiết kiệm dữ liệu và cải thiện thời gian tải trang. Cách Lighthouse tìm ra và đánh giá các ảnh quá cỡ Với từng ảnh trên trang, Lighthouse so sánh kích cỡ của ảnh đã được kết xuất (render) so với kích cỡ ảnh thực tế. Kích cỡ đã được kết xuất cũng được tính toán …

Đọc thêm

Cách đo tốc độ website

Hiệu suất, tốc độ trang trong thế giới thực có biên độ biến thiên cao tùy thuộc vào sự khác biệt giữa thiết bị của người dùng, trạng thái mạng kết nối và các yếu tố khác nữa. Lấy ví dụ, nếu bạn tải trang sử dụng kết nối mạng cáp quang trong văn phòng công ty sẽ khác nhiều với khi sử dụng kết nối WiFi tại quán cà phê đông người, các trải nghiệm diễn ra trong thực tế có thể rất khác nhau. Trên thị trường có nhiều công cụ có thể giúp bạn thu thập dữ …

Đọc thêm

Tối thiểu công việc của luồng chính

Quá trình kết xuất của trình duyệt sẽ chuyển mã của bạn thành trang web mà người dùng sẽ tương tác (interact). Theo mặc định, quá trình kết xuất của luồng chính (main thread) thường xử lý phần lớn mã: nó phân tích cú pháp HTML và xây dựng DOM, phân tích cú pháp CSS và áp dụng các style cụ thể, và phân tích cú pháp (parse), đánh giá (evaluate) cũng như thực thi (excute) JavaScript. Luồng chính cũng xử lý các sự kiện người dùng (user events). Vì thế, bất cứ khi nào luồng chính bận rộn làm …

Đọc thêm

Total Blocking Time (TBT) là gì?

Total Blocking Time (TBT) là chỉ số quan trọng, lấy người dùng làm trung tâm, dùng để đo khả năng đáp ứng tải (load responsiveness), vì nó giúp định lượng mức độ nghiêm trọng của khoảng thời gian từ khi trang không có khả năng tương tác đến khi có khả năng tương tác ổn định (reliably interactive)- TBT thấp giúp đảm bảo trang nhanh chóng sử dụng được. 1. TBT là gì? Chỉ số Total Blocking Time đo tổng lượng thời gian giữa First Contentful Paint (FCP) và Time To Interactive (TTI) khi mà luồng chính (main thread) bị …

Đọc thêm

First Input Delay (FID) là gì?

Vài lời của người dịch: FID là điều không thể tránh, khi người dùng thực hiện tương tác trong khi trình duyệt đang bận rộn tải trang về và thực hiện các hành động theo hướng dẫn (thường là JavaScript), buộc nó phải trì hoãn các yêu cầu tương tác khác. FID trở nên quan trọng vì nó là ấn tượng đầu tiên của người dùng về chuyện tương tác với trang. Trong khi FID không thế tránh, thì dĩ nhiên chúng ta nên tìm cách giảm giá trị này xuống càng nhỏ càng tốt. OK, giờ chúng ta bắt …

Đọc thêm

Tải thích ứng (Adaptive loading): cải thiện hiệu suất, tốc độ web trên các thiết bị chậm

Vài lời của người dịch: Bài viết này chứa nhiều thông tin kỹ thuật, mà để thành thạo thì chúng ta phải thực hành đào sâu nhiều. Nhưng về ý tưởng căn bản thì rất dễ hiểu. Bạn phải nắm bắt được thông tin phần cứng của thiết bị (RAM, CPU) và tốc độ kết nối mạng của người dùng để đưa ra được phiên bản ứng dụng web phù hợp với các điều kiện đó, nhằm giúp trải nghiệm là tốt nhất trong khả năng có thể. Trong bài viết này bạn sẽ học cách đảm bảo rằng: mọi …

Đọc thêm

Largest Contentful Paint (LCP) là gì?

Largest Contentful Paint (LCP) là một chỉ số quan trọng, đặt người dùng vào trung tâm (user-centric) để đo đạc tốc độ tải nhận thức (perceived load speed), bởi vì nó đánh dấu thời điểm trong timeline* tải trang khi mà nội dung chính (main content) của trang có khả năng đã tải xong- “LCP nhanh” giúp trấn an người dùng rằng trang là hữu ích (vì họ sớm biết nội dung lớn nhất trên trang là gì). (*): timeline là kiểu chuỗi quá trình diễn ra sự kiện, giống như lịch biểu. Lưu ý của người dịch: nội dung …

Đọc thêm

Tốc độ website là gì?

Vâng, rõ ràng tốc độ website rất quan trọng, nhưng chính xác thì ý của chúng ta là gì? Có một trang web tải nhanh có nghĩa là như thế nào? Chúng ta hay nghe mọi người nói rằng website của họ được tải trong x,y, z giây hoặc tương tự, nhưng load-tải trang không phải là khoảnh khắc duy nhất trong chuỗi thời gian trải nghiệm; kinh nghiệm cho thấy không một chỉ số riêng lẻ nào có thể có được cái nhìn toàn cảnh về hiệu suất, tốc độ. Có nhiều khoảnh khắc trong suốt trải nghiệm có …

Đọc thêm

Time To Interactive (TTI) là gì?

Time To Interactive (TTI) là một trong sáu chỉ số được theo dõi trong khu vực Performance của báo cáo Lighthouse. Mỗi chỉ số nắm bắt một số khía cạnh của tốc độ tải trang. Đo đạc chỉ số TTI (Thời điểm tương tác) là quan trọng bởi vì một số trang có khả năng tối ưu hiển thị nội dung tốt nhưng lại phải hy sinh khả năng tương tác. Điều này có thể gây bực bội cho trải nghiệm của người dùng, nó kiểu như thế này: Trang web đã hiện ra đây rồi, nhưng khi người dùng …

Đọc thêm