Vì sao các lựa chọn font cho web (khác nhau) lại ảnh hưởng đến tốc độ tải trang? Bài viết này mô tả một số phương pháp sử dụng font cho web và cách chúng ảnh hưởng đến tốc độ trang. Nói chung danh sách được liệt kê từ nhanh nhất đến chậm nhất về mặt lý thuyết và cung cấp các thông tin sau về từng biện pháp: Điểm có lợi; Điểm có hại; Minh họa cách nó làm việc trên mạng; Một ví dụ triển khai điển hình; Một liên kết đến một trang thực sự sử dụng …
Nội tuyến JavaScript là gì? Khi JavaScript ở trong file HTML và nằm giữa thẻ script, nó được gọi là nội tuyến; Nội tuyến JS đơn giản có nghĩa là đưa JavaScript của bạn vào trong file HTML thay vì file JS bên ngoài; Tại sao lại nội tuyến JavaScript? Lợi ích của việc này làm giảm bớt số file mà trình duyệt phải tải trước khi hiển thị trang web của bạn. Thường trang web của bạn sẽ gọi một số file JavaScript bên ngoài (ví dụ widget.js). Vấn đề là, hầu hết các file này đều nhỏ bé. …
Trong bài viết các rắc rối khi lần đầu sử dụng CDN, tôi có đề cập đến hai vấn đề quan trọng đó là việc thiết lập https cho tên miền CDN và việc thiết đặt tên miền tùy chỉnh dạng subdomain của tên miền gốc. Bạn sẽ phải thiết lập https cho CDN nếu trang của bạn cũng là https, nếu không trang web sẽ gặp vấn đề. Và việc dùng tên miền CDN là dạng subdomain của tên miền gốc được cho là tốt hơn cho SEO. Một số dịch vụ như KeyCDN triển khai điều này rất …
Vài lời của người dịch: một bài có tính lý thuyết cao, nhưng tôi vẫn khoái! Vì lý thuyết về màn hình đầu tiên là rất căn bản để bạn đi sâu giải quyết các vấn đề tốc độ trang mà không phải đầu tư tốn kém tiền bạc (ví dụ nâng cấp hosting, sử dụng CDN hay mua các plugin cache cao cấp). Giờ thì chúng ta bắt đầu nào! #1. Nội dung hiển thị/thuộc màn hình đầu tiên là gì? Nội dung hiển thị (visible content) là phần nội dung của trang web mà người dùng thấy trên …
#1. Điểm tương tác trên trang (website) là gì? Điểm tương tác trên trang (page interaction page) là khoảnh khắc người dùng có thể tương tác với chức năng cốt lõi (core functionality) của một trang web. Khả năng tương tác (interaction) nghĩa là thấy nội dung và có khả năng tương tác với nó (click vào nút bấm, thực hiện một lựa chọn, điều hướng, vân vân). Điểm tương tác trên trang là khoảnh khắc có tính khái niệm hơn là sự kiện tải trang có tính kỹ thuật (technical pageload event). Mục đích thực sự, xét cho cùng của …
Cách để trì hoãn tải nhiều file JavaScript cùng một lúc: Bài viết này sẽ mô tả cách trì hoãn tải ảnh, video, các nút mạng xã hội Twitter / Facebook / G+, và Mã phân tích (Analytics). Sử dụng cùng một phương thức bạn cũng có thể trì hoãn mọi thứ khác. Trì hoãn tải JavaScript có thể là bước quan trọng để tăng tốc độ website. Tôi đã viết nhiều về trì hoãn tải ảnh, trì hoãn tải video, và cách trì hoãn JavaScript nhưng câu hỏi tôi hay nhận được nhất là: Làm thế nào tôi có thể …
Brotli là gì? Brotli là mã nguồn mở dành cho việc nén dữ liệu và vượt trội so với nén gzip trong nhiều tình huống; Brotli hiện đang được một số trình duyệt web sử dụng để nén font WOFF2; Brotli hiện đang được sử dụng để nén dữ liệu thông thường thay vì chỉ được dùng để nén font trên trình duyệt Chrome và Firefox. Brotli đang được sử dụng như thế nào? Kể từ khi được sử dụng rộng rãi để nén font WOFF2, Brotli hiện đã được hỗ trợ bởi một số trình duyệt (dưới dạng nén …
Tại sao phải trì hoãn tải video? Khi bạn lấy video từ Youtube, Wistia, Vimeo, vân vân để nhúng vào trong trang web của bạn, nó có thể là nguyên nhân gây tải chậm trang (bạn có thể tham khảo thêm bài viết YouTube tải nặng như thế nào?). Khi video được trì hoãn tải cho đến khi nội dung thuộc màn hình đầu tiên tải xong, điều đó sẽ giúp trang web của bạn tải nhanh hơn mà không cần thu thập tất cả file và các tài nguyên mà video yêu cầu. Bằng cách trì hoãn video bạn …
PS: Nếu bạn dùng dịch vụ CDN chất lượng ví dụ như BunnyCDN, các vấn đề về SEO đã được xử lý ngay từ đầu trong các cài đặt mặc định của họ. CDN là một trong các biện pháp giúp tăng tốc độ website rất hiệu quả, thông qua việc đưa các nội dung tĩnh phân tán khắp các máy chủ trên toàn cầu, và người dùng sẽ lấy được dữ liệu gần họ nhất, qua đó cải thiện thời gian truyền tải dữ liệu (giảm độ trễ / letancy). Và như hệ quả của việc người duyệt web …
Ảnh trì hoãn (deferred image) là ảnh chỉ được tải xuống sau khi nội dung thuộc màn hình đầu tiên (initial page) tải xong. Các hình ảnh không nằm trong màn hình đầu tiên (below the fold) có thể được trì hoãn, điều đó cho phép nội dung website của bạn tải nhanh hơn. Trì hoãn tải hình ảnh giúp trang tải nhanh hơn Bài viết này sẽ hướng dẫn bạn cách đơn giản để áp dụng trì hoãn tải ảnh mà không cần đến jQuery hoặc lazy loading (tải lười biếng). Một trong những lý do chính khiến trang …