Web chạy nhanh, site chạy mượt, truy cập nhanh là một trong những điểm cộng của SEO, vậy làm thế nào để tăng tốc website? Một số cách đơn giản để tăng tốc độ tải của website dưới đây sẽ giúp ích cho bạn
1. Sử dụng CSS sprites
CSS Sprites là kĩ thuật đưa hình ảnh vào trong CSS. Bằng cách sử dụng phương pháp này, bạn sẽ tiết kiệm được tốc độ truy vấn đến server mỗi lần truy cập. Cách này thường được dùng ở Header, Footer, Thanh Sidebar, Menu hoặc các icon, banner tĩnh.
2. Giảm dung lượng file ảnh
Bạn có thể làm điều này bằng cách sử dụng các công cụ hỗ trợ (Như Photoshop, Image Resize…) để giảm dung lượng các file hình ảnh thông qua việc điều chỉnh kích thước phù hợp, giảm độ phân giải, sử dụng đúng định dạng…
3. Tối ưu hiển thị ảnh
Ảnh có thể coi là tài nguyên chiếm nhiều load-time nhất của một trang web, việc tối ưu được hiển thị ảnh đóng vai trò quan trọng trong việc cải thiện load-time của một trang web.
Ngày nay người dùng sử dụng rất nhiều các thiết bị khác nhau để có thể truy cập vào trang web của bạn. Với layout bạn có thể giải quyết bằng responsive design, còn với ảnh câu chuyện sẽ rắc rối hơn một chút.
Cách khắc phục
Sử dụng ảnh phù hợp với kích cỡ màn hình người dùng. Tham khảo các best practices cho việc hiển thị ảnh responsive để tiết kiệm tài nguyên.
Sử dụng các phương thức nén ảnh phù hợp:
GIF, PNG là phương thức nén lossless, ảnh sau khi nén sẽ có chất lượng gần như ảnh gốc, tỉ lệ nén thấp.
JPEG là phương thức nén lossy, ảnh sau khi nén có chất lượng giảm so với ảnh gốc tuy nhiên tỉ lệ nén có thể gấp 10 lần GIF và PNG.
Sử dụng các phương thức nén hiện đại hơn như JPEG 2000, JPEG XR hoặc WebP để tăng tốc độ load.
4. Tối giản hoá các tài nguyên
Khi load trang web, các file html, css, js, script sẽ được load để hiển thị trên browser. Tuy không quá nặng nhưng việc đơn giản hoá, không sử dụng thừa code trong các tài nguyên được load cũng sẽ cải thiện tốc độ load cho trang web.
Cách khắc phục
Minify HTML
Minify CSS
Minify Javascript
Có thể cài PageSpeed Module của google cho webserver (apache, nginx) và mọi thứ cứ để module lo.
Học sử dụng gulp và viết gulp task cho việc minify tài nguyên (worth it).
5. Luôn cập nhật các Plugins, Trình ứng dụng, giao diện
Việc không chú ý cập nhật mới các yếu tố này sẽ làm cho tốc độ tải website của bạn chậm dần theo thời gian, hay khi bạn cập nhật các yếu tố khác làm cho chúng xung đột với nhau. Luôn kiểm tra và cập nhật là cách để giải quyết vấn đề này.
6. Tránh sử dụng quá nhiều các trình nhúng
Các trình nhúng như Flash, Java Script, Code mạng xã hội… làm cho website của bạn hiển thị tốt, thu hút người dùng hơn, tuy nhiên, lại gây ảnh hưởng đến tốc độ tải trang. Vì vậy nên hạn chế khi sử dụng chúng nếu bạn không muốn website của mình load ì ạch.
7. Sử dụng bộ nhớ Cache
Bộ nhớ cache cho phép trình duyệt của người dùng lưu lại các tài nguyên từ lần truy cập trước để giảm thiểu truy vấn từ server khi load trang web. Mặt khác, khi sử dụng bộ nhớ cache, tốc độ tải của website sẽ tăng lên đáng kể, vì người dùng là lưu trữ sẵn một số tài nguyên từ trước đó. Mặt khác, cách này cũng giúp giảm bớt số tiền bạn phải trả để duy trì băng thông hàng tháng cho website của mình.
8. Tối ưu hoá việc load CSS
Một trang web sẽ được hiển thị khi load đầy đủ html, css, js. Nếu file css, js có kích thước quá lớn sẽ khiến trang web bị render-blocking, khiến tốc độ load trang tăng đáng kể.
Cách khắc phục
Inline các file css hoặc js nhỏ bằng thẻ <style> trong phần <head>. Các code này sẽ được load cùng html thay vì phải load từng file nhỏ. ps: khai báo ở đầu trang chứ không phải khai báo trong html tag (<p style=…>) nhé ????
Nên nhớ rằng việc chia css, javascript thành các file nhỏ sẽ giúp project có cấu trúc code tốt hơn, tuy nhiên với mỗi file, browser sẽ tốn thêm 1 request đến server của bạn, đôi khi đọc code thấy css hay script inline thì đừng vội chửi dev ngu nhé ????
9. Tổ chức thứ tự load
Trong Lighthouse audits của Chrome, tốc độ hiển thị first page của trang web là một trong nhưng tiêu chí được đánh giá rất cao trong mục Performance. Để người dùng có trải nghiệm tốt nhất thì việc ưu tiên hiển thị những nội dung cơ bản (above-the-fold – ATF) của trang web là rất quan trọng.
Cách khắc phục
Hãy tổ chức html thật tốt, quyết định đâu là thành phần quan trọng cần load trước (html load theo thứ tự từ trên xuống dưới)
Chia css thành 2 phần, 1 phần inline dành cho các nội dung ưu tiên hiển thị để tăng tốc độ load, 1 phần dành cho các nội dung còn lại
Nếu sidebar và nội dung cùng đặt song song, ưu tiên hiển thị nội dung trước khi hiển thị sidebar
Giảm lượng tài nguyên cần load xuống bằng cách:
Minify tài nguyên
Sử dụng css thay cho ảnh khi có thể
Sử dụng nén
Sử dụng lazy load cho các tài nguyên chưa cần được hiển thị (vd: các ảnh chưa có trong khung hình)
10. Xoá bỏ các Javascript gây ra render-blocking
Trong khi browser tạo ra các DOM tree, nếu gặp một script, nó sẽ dừng lại và thực hiện xong script đó rồi mới tiếp tục tạo ra các DOM. Chính vì thế javascript có thể coi là một nguyên nhân khiến tốc độ tải trang bị chậm đi rất nhiều.
Cách khắc phục
Inline script giống như đã làm với css, tuy nhiên hãy chắc chắn được các script được inline có tốc độ thực hiện nhanh và không gây ra render-blocking.
Sử dụng asynchronous (không đồng bộ) cho javascript, khi gặp script, browser sẽ không dừng lại thực hiện mà sẽ tiếp tục parse HTML đồng thời thực hiện script → tránh bị render-blocking.
Mạnh hơn nữa chúng ta có thể defer javascript, các script sẽ được thực hiện khi trang được load xong ????
Cơ chế load javascript:
Nếu có async: script sẽ được thực hiện song song với parse html.
Nếu có defer: script sẽ được thực hiện sau khi parse html.
Nếu không có: script sẽ được thực hiện ngay, sau đó mới tiếp tục parse html.
11. Lựa chọn một nhà cung cấp dịch vụ lưu trữ (hosting) tốt
Vì điều này ảnh hưởng lớn đến tốc độ tải của website, nên khi lựa chọn nhà cung cấp, bạn nên chú ý đến vị trí nhà cung cấp, kiểm tra tốc độ, cấu hình, hỏi về cách config và hỗ trợ của server. Ngoài ra, khi bạn sử dụng một gói Shared Hosting (các gói host chung một server, IP) thì chắc chắn tốc độ website của bạn sẽ không cao bằng khi bạn dùng gói Dedicated Server (server và IP riêng).
Xem thêm bài viết liên quan Cách cải thiện tốc độ tải trang website
_______________________________________________________________________________
TEAM SEOTOPNHANH.COM
Dịch vụ SEO chất lượng uy tín, từ khóa lên top hiệu quả, chi phí thấp
Phone: 093 6388 931
Email: seotopnhanh1@gmail.com
Chat Skype: seotopnhanh.com (vui lòng gõ ô tìm kiếm để add nick)
https://www.facebook.com/seotopnhanhcom
