Web Load chậm Nguyên nhân và cách tối ưu Tốc độ
Tầm quan trọng của tốc độ tải trang
Các bạn biết đấy, một trong những nguyên nhân ảnh hưởng đến SEO hàng đầu đó là tốc độ load trang web, ở bài trước tôi đã giới thiệu tới các bạn bài viết SEO là gì? Lợi ích của SEO trong Kinh doanh Online.
Tốc độ load trang web thực sự rất là quan trọng nó tác động ảnh hưởng trực tiếp đến SEO, Google đã từng công bố tốc độ load trang là một trong những yếu tố đánh giá xếp hạng Website trong thuật toán mà họ sử dụng. Đó là tầm quan trọng của nó đối với các công cụ tìm kiếm, vậy đối với người dùng trên trang web của bạn sẽ ra sao?
Cảm giác của bạn sẽ ra sao khi truy cập một trang web và rồi ngồi chờ đợi trước một màn hình trắng trong một khoảng thời gian dài mà vẫn chưa tải xong nội dung cần thiết, liệu bạn có đủ kiên nhẫn để chờ đợi khi mà 10 giây trôi qua hay thậm chí là dài hơn nữa.
Mình chắc là khá ít người có thể làm được điều này, thông thường trong trường hợp này người dùng sốt ruột, mất kiên nhẫn và đương nhiên là họ sẽ bỏ đi khỏi trang web của bạn không do dự và tìm kiếm một trang web khác thay thế với tốc độ tải nhanh hơn.
Rồi cuối cùng họ sẽ chẳng một lần nào ghé thăm lại hay ngao ngán khi nhìn thấy trang tên trang web của bạn ở một nơi nào đó về sau nữa.
Bạn đã biết nó quan trọng như thế nào rồi chứ, vậy làm sao để tăng tốc độ tải trang hay tối ưu cải thiện tốc độ hiện tại? Tôi và bạn sẽ cùng đi vào chủ đề chính của bài viết đó là các cách tối ưu tốc độ tải trang. Nhưng trước hết chúng ta hãy điểm qua các nguyên nhân phổ biến làm chậm đi tốc độ tải trang nhé.
Các nguyên nhân phổ biến khiến trang web của bạn tải chậm đi
- Sử dụng dịch vụ Hosting kém chất lượng, không đủ đáp ứng nhu cầu của web
- Lượng Request khi tải trang quá lớn
- Chưa tối ưu hóa các đoạn mã HTML, CSS, JS
- Chưa tối ưu hình ảnh, icon. Chất lượng ảnh quá lớn
- Cài đặt quá nhiều plugin, không kiểm soát các plugin và các ứng dụng của bên thứ ba
- Các nguyên nhân khác
Trên đây là các nguyên nhân phổ biến và bạn hoàn toàn có thể tối ưu cải thiện chúng để có thể làm tăng tốc độ tải trang, tất nhiên sẽ còn có những nguyên nhân khác ảnh hưởng bạn có thể tìm hiểu thêm trên những nguồn thông tin khác. Nào hãy đi sâu vào từng nguyên nhân và tìm hiểu các cách cải thiện nó nhé.
Các cách tối ưu cải thiện tốc độ load trang
- Hosting tốc độ cao và ổn đinh
Website của bạn cần phải được đặt trên máy chủ có chất lượng tốt đáng tin cậy, ổn định và tất nhiên là phải nhanh rồi. Nếu lượng truy cập quá lớn thì bạn nên xem xét việc thuê một máy chủ chất lượng hơn để đảm bảo trang web hoạt động trơn tru.
Hosting mà chúng tôi khuyên bạn dùng đó là http://hostvn.net
Đã giữ uy tín được trong giới Coder và SEOer hàng chục năm qua và đang phát triển rất mạnh, tạo lòng tin và thái độ phục vụ tốt cho khách hàng
- Lượng Request khi tải trang quá lớn
Trong quá trình tải trang, trình duyệt sẽ phải gửi các Request lên phía máy chủ để tải dữ liệu cần thiết về để xây dựng trang, ví dụ như việc tải các tệp file CSS, JS, font, image. Vấn để ở đây đó là giới hạn gửi các Request này, đối với các Hosting thì giới hạn này là khác nhau. Giả sử có 30 Request cần được thực hiện, thì tại một thời điểm nhất định trình duyệt chỉ có thể gửi từ 4 đến 8 Request đồng thời và như vậy sẽ cần phải gửi nhiều lần hơn. Hãy chuyển tới những phần tiếp theo để rõ hơn việc tối ưu Request cho trang web.
- Tối ưu hóa các mã HTML, CSS, JS cải thiện tốc độ load trang web
Đây có lẽ là phần quan trọng nhất vì đây chính là các thành phần liên kết cấu tạo xây dựng lên giao diện trang web của chúng ta. Để có thế tối ưu chúng đương nhiên các bạn phải có kiến thức cơ bản về HTML, CSS, JS…nếu không có kiến thức hãy thử nhờ hoặc thuê một người khác giúp bạn nhé. Các phương pháp dưới đây rất cần thiết để cải thiện tốc độ load trang.
-Tối ưu mã HTML: bạn nên xây dựng một khung HTML rõ ràng, loại bỏ các phần dư thừa không cần thiết như ví dụ như các div không có tác dụng, không có class, id định nghĩa CSS. Loại bỏ các comment, các khoảng trống sẽ giúp dung lượng tệp giảm đi.
-Gộp các tệp CSS, JS: chia nhỏ CSS,JS thành nhiều file nhỏ sẽ giúp bạn dễ dàng quản lý code hơn nhưng sẽ khiến tăng lượng Request khi tải trang khiến tốc độ tải trang chậm đi. Do vậy hãy gộp các tệp CSS, JS lại thành những tệp lớn hơn một cách hợp lý sao cho số lượng tệp càng ít càng tốt.
-Hạn chế việc chèn CSS,JS hoặc nhúng Inline: việc chèn CSS,JS inline làm giảm lượng Request tuy nhiên không nên đưa các đoạn CSS, JS inline vào trong trang HTML vì như vậy sẽ làm tăng dung lượng của tệp và khó quản lý code hơn. Nên sử dụng nhúng file từ file bên ngoài sẽ giúp cho trình duyệt lưu lại cache và không phải load lại cho những file này (dùng CDN).
-Load CSS đầu trang trước JS: CSS nên được load ở đầu trang vì khi trang chưa load xong thì người dùng vẫn có thể nhìn thấy một phần nội dung được hiển thị đúng như định dạng, nếu đặt CSS ở cuối trang thì rất có thể nội dung sẽ được hiển thị xấu k đúng định dạng mong muốn.
-Load JS ở cuối trang: trong quá trình xử lý HTML,CSS khi gặp JS thì trình duyệt sẽ ưu tiên xử lý khởi chạy JS vì vậy việc load HTML, CSS sẽ bị ảnh hưởng, bạn nên đặt JS xuống sau cùng của mã HTML để tránh điều này. Ngoài ra chúng ta nên sử dụng JS có thuộc tính async để tải song song HTML,CSS,JS nhưng đối với thuộc tính này JS sẽ không khởi chạy cho đến khi HTML được load xong hoàn toàn vậy nên sẽ không làm gián đoạn quá trình xử lý HTML. Khi viết code JS nên hạn chế tác động đến DOM.
-Tối ưu hình ảnh: tránh sử dụng các ảnh có chất lượng quá lớn và nặng. Nên sử dụng những ảnh phù hợp và đủ đáp ứng, nên xử lý ảnh để tránh dư thừa cả về kích thước và dung lượng của ảnh. Hãy thử tưởng tượng việc tải ảnh một tấm ảnh độ phân giải 500px 500px chỉ để hiển thị trên tỷ lệ thực sự là 50px 50px hoặc tải những bức ảnh có dung lượng lên đến vài MB, điều này thật tồi tệ.
-Minify các tệp HTML,CSS,JS: Loại bỏ các comment, xóa bỏ các khoảng trắng kí tự xuống dòng sẽ làm giảm khá nhiều dung lượng tệp.
- Tối ưu ảnh hiển thị trên web
Tránh sử dụng các ảnh có chất lượng quá lớn và nặng. Nên sử dụng những ảnh phù hợp và đủ đáp ứng, nên xử lý ảnh để tránh dư thừa cả về kích thước và dung lượng của ảnh. Hãy thử tưởng tượng việc tải ảnh một tấm ảnh độ phân giải 500px 500px chỉ để hiển thị trên tỷ lệ thực sự là 50px 50px hoặc tải những bức ảnh có dung lượng lên đến vài MB, điều này thật tồi tệ.
Gộp các ảnh vào thành một ảnh: nên gộp các ảnh một cách phù hợp vào thành một ảnh và sử dụng CSS sprites để sử dụng chúng như bình thường, việc này sẽ giúp giảm kha khá một lượng Request đấy.
- Cài đặt quá nhiều, không kiểm soát các plugin, ứng dụng của bên thứ ba
-Việc sử dụng các plugin bên thứ ba như các iframe, js, đặt quảng cáo, flash làm cho trang web của bạn chậm đi rất nhiều hoặc còn có gặp rủi ro vì mã độc hoặc bản thân nó không an toàn do vậy tránh sử dụng chúng là tốt hơn hết. Nếu sử dụng bạn nên đặt chúng xuống phía cuối cùng và kiểm soát chúng chặt chẽ.
- Sử dụng hiệu quả Cache
Đây là việc đòi hỏi chuyên môn cao về phía người coder và sự hỗ trợ trên máy chủ, sử dụng cache sẽ giúp trình duyệt không phải tải lại tệp, các tệp này sẽ được lưu trong bộ nhớ đệm được đem ra sử dụng khi tải lại trang vì vậy tăng tốc độ đáng kể khi tải trang.
Kết luận: Trên đây là các phương pháp thông dụng và phổ biến giúp tăng tốc độ tải trang, ngoài ra vẫn còn rất nhiều các khác ở mức độ nâng cao hơn mà bạn có thể tìm hiểu thêm như sử dụng chuẩn nén GZIP trên máy chủ, cấu hình quản lý bộ nhớ trên máy chủ, thiết lập Caching .v.v. Qua bài viết này các bạn có thể hiểu được tầm quan trọng của việc tải trang trong SEO và trong thực tế sử dụng,và mong rằng bạn sẽ áp dụng thành công các phương pháp tối ưu tăng tốc độ tải trang kể trên cho chính trang web của chính các bạn.
Đỗ Minh Hải
