Note Thông báo: Từ ngày 25/05/2021 hệ thống ngừng hoạt động, mọi vấn đề hay thắc mắc trên đây sẽ không được giải quyết. Hãy truy cập Code Pro để được hỗ trợ!

TỐI ƯU TỐC ĐỘ TẢI TRANG CHO BLOGSPOT

Loading...
Hello xin chào các bạn đã quay trở lại với Blog TKN :v

Sau nhiều ngày edit blog thì mình khi kiểm tra Speed Google thì nó rất chậm, từ 73 điểm khi mới thay theme sau edit xuống còn 50. Nhưng sau đó, mình đã tìm tòi, khám phá tài liệu trên mạng để đúc kết một vài kinh nghiệm giúp tối ưu, tăng tốc độ tải trang cho Blog. Việc này giúp ích rất nhiều trong việc SEO của các bạn. Bắt đầu nhé !

Như các bạn đã thấy, ban đầu blog mình khá nặng, nhưng sau những cách làm dưới đây, tốc độ nó nhanh hẳn. Cùng thực hiện nào !

1. Loại bỏ JavaScript và CSS chặn hiển thị trong nội dung trong màn hình đầu tiên

Ở bước này, Google nó sẽ không cảnh báo đúng 100% mà dường như là sai be bét (đối với blog mình) :v Khi bạn chạy phân tích, nó sẽ báo lỗi Javascript chặn hiển thị ở phần Loại bỏ JavaScript và CSS chặn hiển thị trong nội dung trong màn hình đầu tiên. Để loại bỏ VD đoạn JS là 
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'/>
Thì bạn chỉ cần thêm async='async' sẽ là 
<script async='async'src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js' type='text/javascript'></script>
Nhưng có một vài đoạn mã nó hiển thị nhưng Google lại báo không, vậy nên trước khi thêm bạn cần kiểm tra xem nó có hoạt động ở trang chủ không, nếu không thì hãy thêm còn có thì đừng dại mà thêm kẻo nó không hiện nhé !

2. Sử dụng thẻ điều kiện

Việc này rất quan trọng, một JS khi bạn thêm chỉ để chạy ở trang bài viết mà bạn lại không đặt vào trong thẻ điều kiện cho nó thì quả thực là sai lầm. Nó sẽ chạy ở tất cả các trang và tất nhiên là sẽ làm chậm Blog của bạn. Vậy nên hãy thêm thẻ điều kiện cần thiết khi muốn JS, CSS hoạt động ở trang nhất định nào đó nhé !


 3. Tối ưu hình ảnh

Đây là bước nhiều bạn bảo nó không ảnh hướng nhiều nhưng Ảnh là một trong những thành phần quyết định đến tốc độ Blog. Sau khi làm bước này mình cảm thấy khá thích thú khi nó lên tận 7 điểm :v
  Ở nhiều blog, Thumbnail ngoài trang chủ thường được gắn là Ảnh đầu tiên bài viết. Thường thì những bức ảnh đó thường khá nặng vì ảnh trong bài viết thì phải đẹp cũng như kích thước lớn nữa. Nên nó sẽ ảnh hưởng rất nhiều đến Blog của bạn. Vậy làm thế nào để giải quyết vấn đề đó ?
   Mình có kham khảo một vài bài viết trên mạng thì nó cũng sẽ lấy ảnh đầu tiên nhưng sẽ cắt đi cho vừa với Thumbnail. Cũng khá hay nhưng nó chỉ là giảm kích thước chứ không nén ảnh nên ảnh sau khi cắt vẫn sẽ rất nặng. Vậy phải làm thế nào?
Để tối ưu thì mình sẽ lấy ảnh đầu tiên, một bức ảnh cực nhỏ đủ làm Thumbnail và đã nén nhưng khi độc giả xem bài viết vẫn sẽ thấy một bức ảnh đầu tiên tuyệt đẹp.
Cách này lúc trước mình đã hướng dẫn các bạn ở LinkThuThuat.com, các bạn có thể xem lại bài viết  TẠI ĐÂY.

4. Không sử dụng ảnh làm Background cho Blog

Có thể nói làm như vậy thì blog sẽ đẹp hơn nhưng quả là sai lầm khi bạn hãy tưởng tượng, một Thumbnail thôi cũng đã bị Google cảnh báo chứ nói gì cái ảnh Background to bự thế kia :v Nói ngang đấy chắc các bạn cũng tự hiểu ha :v

5. Xóa CSS, JS thì phải xóa triệt để

Đôi khi các bạn xài theme khác rồi tùy biến lại thì trong quá trình edit theme, bạn sẽ bỏ những widget, những thứ không cần thiết nhưng đa số bạn chỉ xóa phần hiển thị của nó còn phần JS, CSS của nó bạn gần như không quan tâm.
Khi xóa những đoạn code hiển thị không cần thiết, bạn cần phải tìm những CSS, JS liên quan và xóa luôn nó, việc này sẽ giúp Blog load nhanh hơn rất nhiều đấy.
Ví dụ mình có đoạn code sau:
<div class="testcss_t" id="jscss">ABC</div>
Chẳng hạn bạn cần xóa đoạn code đó thì bạn cần phải tìm hết những thứ liên quan đến nó và xóa đi, ví dụ ở đây mình sẽ tìm .testcssjscss.
Lưu ý: Trước khi xóa, bạn cần kiểm tra xem còn code nào sử dụng thuộc tính đó nữa không, nếu có thì đừng dại mà xóa nhé =))))

6. Hạn chế lấy dữ liệu từ Blogspot

Ở blog mình thì phần nào mình lấy dữ liệu cũng đều bị cảnh báo, ví dụ như lấy dữ liệu thống kê nhận xét mới sẽ có JS như sau:
 <script src='/feeds/comments/summary?alt=json-in-script&amp;callback=nhanxetmoi'></script>
Những đoạn code này chiếm tốc độ load khá cao, vậy nên các bạn nên hạn chế lấy dữ liệu để hiển thị cho Blog nhá !
Có 1 cách để tối ưu nó nhưng mình vẫn chưa tìm ra :v

7. Tận dụng bộ nhớ Cache của trình duyệt cho Blogger

Đây là cách tối thượng nhất trong việc tối ưu Blogspot. Nói nôm na là khi người dùng và blog bạn thì máy chủ sẽ lưu lại các JS, CSS, code... của blog trước đó và các lần sau khi vào nó sẽ rất nhanh mà không cần phải tải lại các JS, CSS, code đó nữa.
Rất đơn giản chỉ cần chèn đoạn code này vào Blog
<include expiration='7d' path='*.css'/>
<include expiration='7d' path='*.js'/>
<include expiration='3d' path='*.gif'/>
<include expiration='3d' path='*.jpeg'/>
<include expiration='3d' path='*.jpg'/>
<include expiration='3d' path='*.png'/>
<meta content='public' http-equiv='Cache-control'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<meta CONTENT='text/javascript' http-equiv='Content-Script-Type'/>
<meta CONTENT='text/css' http-equiv='Content-Style-Type'/>
<meta content='tue, 02 jun 2020 00:00:00 GMT' http-equiv='expires'/>
<meta charset='utf-8'/>
<meta content='width=device-width, initial-scale=1' name='viewport'/>
<meta content='blogger' name='generator'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
Sau khi là 7 cách trên thì đây là kết quả của Blog mình


Thật tuyệt phải không nào ! Hi vọng với những cách làm trên sẽ giúp Blog của bạn có một tốc độ tải BÀN THỜ :v

Chúc các bạn thành công !
  1. thanks bạn nha. Bài viết rất hay. đang cần lắm

    Trả lờiXóa
  2. Bài này thỉnh thoảng đổi thêm em vẫn phải vào để lấy code :)) Rất có ích

    Trả lờiXóa