Hướng dẫn cho người mới bắt đầu tối ưu hóa tệp trang web (Tải nhanh hơn 70%)

Để tăng tốc trang web của bạn và tiết kiệm băng thông, nén là một trong những cách hiệu quả nhất (và dễ nhất) để thực hiện điều đó.


Tuy nhiên, nhiều chủ sở hữu trang web vẫn không ủng hộ tối ưu hóa các tập tin của họ vào năm 2020, vì họ không biết điều đó quan trọng như thế nào hoặc họ không biết cách làm.

Để rút ngắn một câu chuyện dài, một trong những cách quan trọng nhất để tăng tốc độ tải trang của bạn là làm cho các tệp JavaScript (JS) của bạn tải nhanh hơn. Và bạn có thể tăng tốc JavaScript của mình bằng cách sử dụng nén GZIP.

Bây giờ, điều này chỉ lý tưởng cho các trình duyệt hiện đại, nhưng hầu hết mọi người trên internet đang sử dụng một thiết bị và trình duyệt gần đây. Cả Yahoo và Google đều sử dụng nén GZIP.

Nhưng trước tiên, hãy để thiết lập một chút bối cảnh.

Bước # 1: Mã hóa nội dung là gì?

Để có thể tối ưu hóa hiệu quả các tệp trang web của bạn, điều quan trọng là phải hiểu một khái niệm được gọi là mã hóa nội dung.

Nói một cách đơn giản, điều này được sử dụng để làm cho tài liệu có thể được nén mà không có nguy cơ mất nhận dạng loại phương tiện cơ bản. Trình duyệt của bạn sẽ nói chuyện với một máy chủ web khi bạn yêu cầu một tệp.

Yêu cầu HTTP

Về cơ bản, trình duyệt cho máy chủ biết những gì nó muốn. Các máy chủ tìm kiếm nó và tìm thấy nó. Trình duyệt sau đó tải nó. Tệp càng lớn, trình duyệt càng mất nhiều thời gian để tải nó.

Vậy, bạn sẽ làm gì khi một tệp quá lớn?

Bạn sẽ nén nó. Khi bạn gửi tệp được nén vào trình duyệt, bạn tiết kiệm cả thời gian tải xuống và băng thông.

Có hai yếu tố liên quan đến máy chủ và trình duyệt biết rằng việc gửi tệp nén là ổn:

  • Trình duyệt cho phép máy chủ biết việc gửi nội dung nén bằng cách gửi tiêu đề là tốt
  • Nếu nội dung được nén, máy chủ sẽ gửi phản hồi

Nếu tệp không được nén, máy chủ sẽ không gửi qua tiêu đề phản hồi mã hóa nội dung. Tiêu đề chấp nhận mã hóa không phải là một nhu cầu, mà chỉ là một yêu cầu được thực hiện bởi trình duyệt.

Trình duyệt sẽ phải đối phó với phiên bản nặng thông thường là máy chủ không gửi qua nội dung nén.

Bắt máy chủ thiết lập

Bạn không có quyền kiểm soát trình duyệt. Nó sẽ gửi tiêu đề hoặc nó sẽ không gửi nó. Tuy nhiên, bạn có thể định cấu hình máy chủ bạn đang sử dụng để đảm bảo nội dung khóa kéo được trả lại miễn là trình duyệt có thể xử lý. Điều này dẫn đến tiết kiệm băng thông đáng kể.

hiệu suất web sau khi nén

Để làm điều này, chỉ cần kích hoạt cài đặt nén cho IIS. Nếu bạn đang sử dụng Apache, việc kích hoạt nén đầu ra tương đối đơn giản. Chỉ cần truy cập tệp .htaccess của bạn và thêm mã thích hợp.

Có hai tùy chọn nén để chọn với Apache:

  • mod_deflate là tiêu chuẩn và dễ dàng hơn để thiết lập nó
  • mod_gzip cho phép bạn nén trước nội dung và nó xuất hiện mạnh mẽ hơn

apache dễ dàng xì hơi

Cho dù bạn chọn tùy chọn nào, Apache sẽ xem liệu trình duyệt có gửi tiêu đề cho mã hóa chấp nhận hay không, sau đó trả lại tệp trong phiên bản thông thường hoặc phiên bản nén của nó.

Nếu một trình duyệt cũ hơn gây ra sự cố, có những điều bạn có thể làm để sửa nó bằng cách thêm một số chỉ thị đặc biệt.

Để trả về nội dung nén, bạn có thể sử dụng PHP nếu bạn không thể thay đổi tệp .htaccess của mình. Trong PHP:

<?php if (struct_count ($ _ SERVER [‘HTTP_ACCEPT_ENCODING,], g gzip,)) khác ob_start (); ?>

Một phiên bản được nén của tệp được trả về sau khi kiểm tra tiêu đề mã hóa chấp nhận. Điều này tương tự với việc tự mình xây dựng một máy chủ web. Để nén đầu ra của bạn, Apache làm cho nó dễ dàng hơn.

Thông báo quan trọng: hầu hết các phần mềm xây dựng trang web không cho phép chỉnh sửa cấp mã (với một số ngoại lệ). Trên Hosting Canada, chúng tôi là những người ủng hộ mạnh mẽ việc tự lưu trữ trang web của bạn, nhưng nhận ra rằng nó không dành cho tất cả mọi người. Khi sử dụng các trình tạo trang web như Squarespace, Wix hoặc Weebly, loại tin nhắn cấp độ máy chủ này có thể nằm ngoài tầm với của bạn.

Xác nhận nén của bạn

Điều quan trọng là đảm bảo rằng bạn đang cung cấp nội dung nén sau khi bạn hoàn tất cấu hình máy chủ của mình. Để xác định xem trang của bạn có được nén trực tuyến hay không, bạn có thể sử dụng thử nghiệm GZIP trực tuyến.

Trong trình duyệt của bạn, các công cụ dành cho nhà phát triển có thể hỗ trợ bạn điều này. Bạn sẽ muốn chuyển đến tab mạng, làm mới trang và sau đó nhấp vào trang mạng cụ thể.

Nếu nội dung được gửi nén, bạn sẽ thấy tiêu đề mã hóa nội dung: Tiêu đề GZIP..

tiêu đề google chrome gzip

Để biết thêm chi tiết, bạn có thể nhấp vào biểu tượng cho sử dụng hàng lớn. Điều này cũng cung cấp thông tin về kích thước nội dung thực và kích thước truyền nén.

Hãy cẩn thận để xem xét

Nén cung cấp rất nhiều lợi ích, nhưng có những nhược điểm cho tất cả mọi thứ. Bạn muốn nhận thức được những điều sau đây:

  • Đồ thị tỷ số nénNội dung đã được nén: Hầu hết âm nhạc, video và hình ảnh đã được nén. Nếu bạn cố nén chúng lại, điều này phần lớn chỉ là lãng phí thời gian. Trong hầu hết các trường hợp, bạn chỉ cần lo lắng về việc nén CSS, HTML và JavaScript.
  • Các trình duyệt cũ hơn: Nội dung nén không tương thích với tất cả các trình duyệt. Điều này đặc biệt đúng đối với các trình duyệt cũ hơn. Ví dụ: bạn có thể muốn tránh nén HTTP nếu bạn phải làm việc trên Windows 95 hoặc với Netscape 1.0. Có một số quy tắc và hướng dẫn để tránh nén cho các trình duyệt cũ hơn với chế độ khử lỗi Apache.
  • Tải CPU: Tiết kiệm băng thông và sử dụng thời gian CPU khi bạn nén nội dung nhanh chóng. Xem xét tốc độ nén, sự đánh đổi thường được xem là công bằng. Có nhiều cách để gửi cả phiên bản nén và nội dung tĩnh được nén trước. Điều này thường đòi hỏi cấu hình nhiều hơn. Hãy nhớ rằng mọi người trên internet có khoảng chú ý ngắn, vì vậy tăng tốc độ cho trải nghiệm người dùng tốt hơn bằng cách sử dụng chu kỳ CPU thường luôn là một ý tưởng hay.

Tại sao bạn nên sử dụng nén GZIP

giao diện điều khiển nén httpNén GZIP cung cấp rất nhiều lợi ích. Điều quan trọng là phải biết những thứ này là gì để bạn nhận thức đầy đủ về lý do tại sao bạn nên bắt đầu sử dụng nó.

Trung bình, sử dụng GZIP để nén các tệp CSS và HTML giúp bạn tiết kiệm 50 đến 70 phần trăm tổng kích thước tệp. Tiết kiệm kích thước tệp đáng kể này mang lại trải nghiệm người dùng hiệu quả và tốt hơn trên trang web của bạn.

Kỹ thuật này cũng đóng một vai trò quan trọng trong SEO tổng thể của trang web của bạn. Các công cụ tìm kiếm sử dụng các thuật toán phức tạp để xác định vị trí của các trang web và trang web trong kết quả tìm kiếm.

Một yếu tố trở nên quan trọng hơn với mỗi lần cập nhật thuật toán là thời gian tải trang web. Công cụ tìm kiếm sử dụng thông tin này để xác định tối ưu hóa tổng thể của trang web.

kiểm tra tốc độ nén gzipKhi các trang web tải nhanh, những người truy cập trang web không phải đợi để truy cập nội dung họ đang tìm kiếm. Hãy nhớ rằng người dùng internet có một khoảng chú ý ngắn.

Nếu một trang web mất quá nhiều thời gian để tải, người dùng có thể nhấp vào và tìm một trang web nhanh hơn với thông tin tương tự. Công cụ tìm kiếm muốn thưởng cho các trang web tải nhanh hơn, vì vậy họ cung cấp cho họ vị trí kết quả tìm kiếm cao hơn.

Một trang web nhanh hơn cũng làm tăng chuyển đổi. Điều này có nghĩa là nếu bạn có một trang web thương mại điện tử, nó tải càng nhanh, doanh số của bạn càng cao. Trên thực tế, khoảng 51 phần trăm người Mỹ nói rằng lý do số một khiến họ từ bỏ mua hàng là một trang web chậm.

Nghiên cứu điển hình cho thấy rằng bạn có thể cải thiện tỷ lệ chuyển đổi của mình hơn 15 phần trăm bằng cách giảm thời gian tải trang web của bạn xuống chỉ còn 2,2 giây.

Khắc phục sự cố với GZIP Nén

Giống như tất cả các yếu tố công nghệ, nén GZIP có thể thất bại vì những lý do nhỏ nhất. Tin tốt là hầu hết các lý do cho sự thất bại đều có thể sửa chữa.

Yếu tố đầu tiên để xem xét là liệu nén GZIP có được máy chủ web của bạn hỗ trợ hay không. Mặc dù hầu hết đều hỗ trợ nó do tầm quan trọng của nó đối với việc tải trang, có một số người chọn không bận tâm để đảm bảo tính tương thích. Bạn có thể liên hệ với máy chủ web của mình để xác định xem khả năng tương thích GZIP có phải là vấn đề không.

Yếu tố tiếp theo để khám phá là mã của bạn. Ngay cả một nhân vật sai cũng có thể gây ra vấn đề. Tìm kiếm một ký tự bị bỏ lỡ, một lỗi cú pháp hoặc bất kỳ mã không đúng định dạng. Tất cả mã hóa của bạn phải hoạt động với kiến ​​trúc của bạn để nén thành công.

Bạn chỉ có thể kiểm tra mã của mình mà bạn nhập bằng PHP hoặc .htaccess (điều này đã được thảo luận ở trên). Nếu bạn không thể tìm thấy một vấn đề, nhưng bạn tin rằng mã là đáng trách, hãy xem xét việc trao đổi nó hoàn toàn với một mã khác có nhiều khả năng hoạt động.

Trong một số trường hợp, máy chủ web của bạn có quyền truy cập vào đúng tệp để cho phép nén GZIP, nhưng bạn thì không. Trong trường hợp này, chỉ cần gọi máy chủ của bạn và yêu cầu họ kích hoạt.

Bạn đã học trước đó trong bài viết này về việc kiểm tra nén GZIP của bạn. Đây là một tùy chọn nhanh chóng và dễ dàng để khắc phục sự cố. Thông thường bạn nên làm điều này trước tiên. Nếu vẫn có lỗi, hãy kiểm tra với máy chủ web của bạn và đánh giá mã bạn đã sử dụng.

Nếu trình duyệt của bạn đã hết hạn, điều này cũng có thể gây ra vấn đề với nén GZIP. Điều này đặc biệt phổ biến với các phiên bản Internet Explorer cũ. Nếu nhiều người truy cập trang web của bạn sử dụng trình duyệt cũ, đây là vấn đề bạn có thể phải giải quyết.

Nếu các tệp trên trang web của bạn cực kỳ lớn, điều này cũng có thể gây ra các vấn đề liên quan đến nén GZIP. Nếu bạn đang sử dụng phiên bản GZIP cũ hơn, giới hạn kích thước tệp có thể tương đối nhỏ, chẳng hạn như hai gigabyte trở xuống. Vì điều này, bạn muốn xác định giới hạn của phiên bản GZIP của bạn là gì.

Một trong những cách tốt nhất để cải thiện hiệu suất và tốc độ của trang web của bạn bằng cách cho phép nén. Bây giờ bạn đã biết cách thực hiện, bạn có thể bắt đầu tận dụng tối đa lợi ích.

Hãy nhận biết các cảnh báo và xem xét chúng khi bạn làm việc. Bước tiếp theo là thiết lập nó để khách truy cập của bạn có thể gặt hái những lợi ích.

Một yếu tố tốc độ trang web thường bị bỏ qua có liên quan đến sự lựa chọn của bạn về công ty lưu trữ web. Vâng, nó sẽ tạo ra sự khác biệt mà bạn chọn, vì một số chỉ đơn giản là hoạt động tốt hơn khi bạn dành thời gian để bẻ khóa dữ liệu.

Để biết thêm thông tin, hãy xem hướng dẫn của tôi về cách cải thiện tốc độ trang web của bạn.

Tài liệu tham khảo và tín dụng hình ảnh:

  • BetterExplained.com
  • OpenSourceVarsity.com
  • Geekeasier.com
  • WebPerformance.com
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map