Các giải pháp tăng tốc Website (Phần 2)

14:56 24/05/2022

Hãy cùng Cao đẳng FPT Polytechnic tiếp tục tìm hiểu về những giải pháp giúp tăng tốc website tại bài viết dưới đây nhé!

 4. Nén code HTML trả về cho Browser

Giải pháp thứ tư là nén code html/css, js trong request mà server trả về cho browser. Việc nén này sẽ giúp độ dài của dữ liệu trả về từ server sẽ nhỏ lại, nhờ đó trang web trả về đến browser nhanh hơn.

  • Nén html online

Việc nén html thực chất là xóa các ký tự không cần thiết với browser như các ký tự xuống hàng, các comment , các khoảng rắng liên tiếp nhau… Sau đây là vài website giúp bạn nén html online để bạn dùng hoặc xem kết quả:

https://htmlcompressor.com/compressor/
https://www.compresss.com/compress-html.html

 <html>                 <head>  <!– Chú thích 1 –>

 <title>Nguyễn Văn Tèo</title>

 <link rel=”stylesheet” href=”css/dd.css”>

 <script src=”js/ha.js”></script>  <!– Chú thích 2 –>

 <link rel=”icon” href=”data:,”>

 </head>

 <body>     <!– Chú thích 3 –>

 <div id=”tinxemnhieu”>

     <h4>Tin xem nhiều</h4>

     <p><a href=””>Giá và chất lượng gạo, </a></p>

     <p><a href=””>Hoàng hôn trên sông Mê Kông </a></p>

     <p><a href=””>Báo chí quốc tế nói về Calisto? </a></p>

     <p><a href=””>Mười bí quyết cho hạnh phúc </a></p>

     <p><a href=””>Khánh Hòa đăng cai HH 2008 </a></p>

 </div>

 <div id=”hinhdep”>

     <h4>Hình đẹp</h4>

     <img src=”images/h1.jpg”>        <img src=”images/h2.jpg”>

     <img src=”images/h3.jpg”>        <img src=”images/h4.jpg”>

     <img src=”images/h5.jpg”>        <img src=”images/h6.jpg”>

     <img src=”images/h7.jpg”>        <img src=”images/h8.jpg”>

 </div>

 </body>              </html>

Kết quả nén:

  • Nén code đổ về từ trang php

Lệnh sau viết ở đầu trang web động php sẽ giúp nén kết quả html của trang php trước khi đổ về: <?php ob_start(‘ob_gzhandler’);  ?>

Trang web có kích thước 32KB trước nén,  khi đã nén thì chỉ còn hơn 6KB.

  • Nén code các file css, javascript

Trong Apache có module deflate giúp bạn nén html css, js. Muốn dùng thì bạn tạo 1 file có tên .htaccess đặt trong folder website và code như sau:

 <IfModule mod_deflate.c>

 AddOutputFilterByType DEFLATE text/css

 AddOutputFilterByType DEFLATE text/html

 AddOutputFilterByType DEFLATE text/javascript

 AddOutputFilterByType DEFLATE text/plain

 </IfModule>

Xem kết quả trong hình dưới: file thohay.html kích thước 99.82KB sau khi nén chỉ còn 33.09KB . Tất nhiên 33.09KB truyền trên đường truyền sẽ nhanh hơn 99.82KB vì lượng dữ liệu nhỏ hơn.

5. Client Cache với Htaccess

Giải pháp thứ năm giúp tăng tốc website là client cache, tức là lưu cache các tài nguyên dùng cho trang web trong trình duyệt, để khỏi phải request lại. Đây là giải pháp rất quan trọng, dễ làm và giúp tăng tốc website rất đáng kể.

Trong webserver Apache có module mod_header . Module này bạn giúp gửi các yêu cầu cache file cho trình duyệt. Thực hiện bằng cách tạo 1 file có tên .htaccess trong folder website (nếu có file rồi thì mở lên) và code:

  # cache images và flash 30 ngày

 <FilesMatch “.(gif|jpg|jpeg|png|ico)$”>

    Header set Cache-Control “max-age=2592000”

 </FilesMatch>

 # cache text, css, và javascript, html files 1 tuần

 <FilesMatch “.(js|css|pdf|txt|htm|html)$”>

    Header set Cache-Control “max-age=604800”

 </FilesMatch>

 # không cache scripts files

 <FilesMatch “\.(php)$”>

    Header unset Cache-Control

 </FilesMatch>

Với cache ở trình duyệt thế này, phần lớn các file tài nguyên như hình ảnh, css, js… dùng trong trang web đã được lưu trong lần request trước, cho nên trang web sẽ hiện cực kỳ cực kỳ nhanh trong những lần request sau.

6. Server File Catching

Giải pháp thứ 6 là server file caching, nếu như giải pháp thứ 5 là cache ở trình duyệt thì giải pháp này chúng ta sẽ thực hiện trên server.

Tại sao có giải pháp này? Bởi vì mỗi khi có một request đến trang web động, thì quá trình tạo nội dung cho trang sẽ diễn ra. Hoạt động tạo nội dung này cứ lặp đi lặp lại giống nhau với mọi request và kết quả tạo trang thường giống nhau cho mọi request trong 1 khoảng thời gian.

Tuy nhiên giải pháp này là khó nhất, cần 1 số kiến thức php mức độ khá và  xử lý một số vấn đề phát sinh cho nên Thầy sẽ trình bày trong các dịp sau nhé.

Tổng kết

Các giải pháp tăng tốc website vừa được trình bày trên là những kiến thức quan trọng, giúp bạn triển khai website chạy được nhanh , website sẽ được đánh giá tốt từ người dùng và search engine.  Bạn hãy áp dụng cho website của mình đi nhé.

 

Giảng viên Nguyễn Văn Long
Bộ môn CNTT – Cao đẳng FPT Polytechnic HCM

Cùng chuyên mục

Đăng Kí học Fpoly 2022

Bình Luận

Your email address will not be published. Required fields are marked *