Tối ưu hóa hiệu suất cho trang web là gì?

Các ứng dụng web là sự kết hợp mã code giữa Server-side và Client-side. Do vậy hiệu suất của một trang web có thể gặp ở cả 2 phía, và cần được tối ưu hóa ở cả 2. Về mặt Client-side thì hiệu suất thường liên quan đến các vấn đề như trình duyệt, có thể là việc load một trang web lúc khởi tạo, tải tất cả các resources cùng một lúc, việc chạy javascript không hiệu quả... Về phía Server-side thì lại liên quan đếncác vấn đề tốn thời gian để xử lý các Request, Tối ưu hóa hiệu suất trên Server-side thì thường liên quan đến những thứ như làm việc với database, hay là các ứng dụng phụ thuộc.

Tối ưu hóa Client-side

Việc tối ưu hóa Client side xuay quanh các vấn đề như giảm tổng thể kích thước trang web, bao gồm kích thước của các files, và số lượng các file,

Caching & content delivery networks

Một trong những cách tốt nhất là sử dụng content delivery network (CDN). Trong một ứng dụng web thì chúng ta có rất nhiều file như javascript, css, images files và những file này là tĩnh không thay đổi trong quá trình sử dụng. Vậy CDN là gì. có thể hiểu đó là mạng phân phối nội dung. Nghĩa là nó là một hệ thống máy chủ trên toàn cầu làm nhiệm vụ lưu bản sao các nội dung tĩnh của các trang web, sau đó phân tán nó ra nhiều máy chủ khác (được gọi là PoP) và từ các PoP sẽ gửi các nội dung tĩnh này tối cho người dùng truy cập vào website. Bằng cách này chúng ta có thể tăng hiệu suất của trang web bằng cách caching những file tĩnh trên những server mà gần nhất với người sử dụng. Điều này không những giúp người dùng có thể lấy các file tính ở server gần nhất và còn làm giảm lưu lượng truy cập trực tiếp vào server của bạn giúp cho trang web load nhanh hơn.

Bundle & minification

Một việc rất quan trọng đó là tập trung các files lại với nhau, vì vậy sẽ giúp chúng ta có ít files hơn, và chúng ta cũng có thể tối ưu hóa nội dung để có thể thu gọn lại nội dung của các file thông qua rất nhiều kỹ thuật minification. Nhưng có một việc đó là chúng ta phải thay đổi code để hoàn thành việc này, một công việc được thực hiện nhiều nhất có thể thấy đó là việc combine các file JavaScript lại với nhau.

Optimizing image usage

Việc tối ưu hóa sử dụng hình ảnh cũng rất quan trọng. Ví dụ như việc thường xuyên sẻ dụng các file ảnh có kích thước lớn, đặc biệt ngày nay máy móc có độ phân giải rất cao nên hầu như các ảnh cũng có dung lượng rất lớn, cộng với việc rất nhiều trang web làm việc với nhất nhiều ảnh chẳng hạn như Instargram, điều này sẽ làm cho trang web của chúng ta cực kỳ chậm. Rất nhiều ảnh có thể được tối ưu và làm cho kích thước nhỏ hơn, Có rất nhiều công cụ cho jpeg và png file để giúp thu gọn kích thước cho các files. Nếu bạn có nhiều icon nhỏ trong trang web thì nên chuyển qua dùng icon Font like Awesome hoặc sử dụng image spirites. Nếu bạn có một trang web với rất nhiều ảnh thì nên cân nhắc việc sử dụng lazy loading images. Nó có nghĩa là khi bạn load một page thì bạn chỉ cẩn load các hình ảnh mà chúng ta có thê thấy trên màn hình. Khi bạn cuộn chuột xuống thì lại tiếp tục xử lý load thêm hình ảnh.

Critical Path and Render Blocking Resources (CSS + JS)

Blocking the DOM cũng là môt nguyên nhân gây chậm khi load trang, một số cách để tránh trường hợp CSS và Javascript từ blocking the DOM thông qua tối ưu hóa việc chỉ đinh các đường dẫn quan trọng

CSS

Chỉ định đúng các file css cần dùng Sử dụng media queries để đánh dấu file CSS nào là non-render blocking Giảm số lượng file CSS, có thể cộng dồn file nếu có thể Tối ưu hóa CSS file như xóa bỏ ký tự trống, chú thích Hạn chế sử dụng CSS theo kiểu file chung

Javascript

Đặt vị trí cho các file javascript ở cuối trang, ngay phía sau phần đóng body tag Sử dụng async hoặc dể directive để tránh render blocking Cộng dồn các file js nhở thành 1 file Tối ưu hóa file js như xóa dấu cách, chú thích Sử dụng inline javascript nếu file nhỏ

Tối ưu hóa Server-side

Ở phía server side thì các nhân tố chính ảnh hưởng tới hiệu suất thường là về vấn đề biên dịch, hay vấn để khi sử dụng database. Các khía cạnh có thể nói về hiệu suất là việc sử dụng CPU và Memory.

• CPU: Tài nguyên CPU là cực ký quan trọng vì nó được sử dụng để chạy các ứng dụng. Vai trò hiệu suất của CPU có thể so sánh như khả năng chịu tải của hệ thống cho số lượng người dùng. Việc sử dụng quá nhiều CPU có thể là nguyên nhân dẫn tới việc tạo ra các lỗi ngoại lệ không mong muốn, và gây chết chương trình.
• Memory: Tài nguyện bộ nhớ cũng rất quan trọng trong việc hỗ trợ cho việc chạy database, thực tế thì số lượng lớn bộ nhớ tốn kém cho việc sử dụng các câu lệnh chạy database. Việc sử dụng quá nhiều bộ nhớ sẽ là nguyên nhân khiến cho việc load trang web bị chậm.

Optimize usage of application dependencies

Hầu hêt các ứng dụng sử dụng SQL databases, caching, external web services và các application dependencies. Đó là những cái như là SQL Server, Oracle, MongoDB. Từ việc đánh giá được việc sử dụng các ứng dụng phụ thuộc nào gây tốn nhiều tài nguyên, thời gian để chúng ta có thể đưa ra quyết định sử dụng hợp lý.

Optimize exception handle

Chúng ta cần tránh tối đa các ngoại lệ, bởi vì nó sẽ làm giảm đáng kể tốc độ thực thi của chương trình. Mục đích của khối try-catch là để nắm bắt và xử lý các trường hợp ngoại lệ được tạo ra từ các đoạn mã thực thi

Using Lazy-load

Đây là một mẫu thiết kết được sử dụng khá nhiều trong kỹ thuật phần mềm. Lợi ích thiết kế lazy-load sẽ giúp tối ưu được bộ nhớ của chương trình trong quá trình thực thi do dữ liệu chỉ được tải vào bộ nhớ khi nó thực sự cần dùng đến. Giảm thiểu thời gian khởi động của ứng dụng. Tránh được những thực thi truy vấn SQL về Database.

Server caching

Outpug caching: Khi dùng Output caching toàn bộ nội dung của trang sẽ được lưu lại. Với những trang có lượng truy cập lớn, caching sẽ thường xuyên lưu lại (đến) từng phút một. Khi một trang được lưu lại bằng Output cache, Những yêu cầu gửi tới trang đó sẽ được thực hiện ở trang output mà không cần phải thi hành code hay tạo lại nữa. Chúng ta có thể sử dụng cache output theo tham số url, theo điều khiển. Fragment caching: Đôi khi website chỉ muốn cache lại một phần của trang khi đó ta sẽ cache một usercontrol trong trang chẳng hạn cần cache phần hiển thị dữ liệu thời tiết trong vòng 5 phút. Data cache: Với các thành phần dữ liệu không đòi hỏi cập nhật thường xuyên thì nên dùng data caching để lưu chúng lại trong bộ nhớ giảm chi phí truy vấn xuống cơ sở dữ liệu .

Optimize Database

Một điều rất quan trọng đó là việc tối ưu hóa database, khi làm việc với database thì hiệu suất khi làm việc với database ảnh hưởng rất nhiều đến tốc độ của một trang web. Một số tip cho việc tối ưu hóa database như: Avoid Looping queries if not needed Picking only needed columns Filtering rows correctly and using indexes Indexing correctly Picking the right engine for your data Caching

Nguồn tham khảo: https://stackify.com/web-performance-optimization/ https://thachpham.com/hosting-domain/cdn-la-gi-va-khi-nao-nen-dung-cdn-cho-website.html https://docs.sitefinity.com/for-developers-server-side-development-performance-tips https://quocbaoit09.wordpress.com/2017/08/14/toi-uu-hoa-performance-cac-ky-thuat-toi-uu-hieu-nang-server-side/