Tải chậm YouTube nhúng WordPress
|
Các trang web trung bình có trọng lượng 3719 kB với hình ảnh và video chiếm gần 78% tổng trọng lượng theo Lưu trữ HTTP. Đó là rất nhiều byte để trình duyệt của khách truy cập trang web tải xuống và hiển thị, đồng thời tất cả các xu hướng đều hướng đến các trang web lớn hơn và tăng cường sử dụng hình ảnh trong tương lai. WordPress đang dẫn đầu về chia sẻ phương tiện và kết hợp các tệp phương tiện vào thiết kế trang web. Với WordPress, thật dễ dàng để tích hợp hình ảnh và video vào bài đăng, trang và thậm chí vào nền của chủ đề Show
Với việc phát hành WordPress 5. 5 lazy loading đã trở thành một phần của phiên bản cốt lõi và giúp thực hiện kỹ thuật này rất dễ dàng Tuy nhiên, tất cả những tài nguyên nặng nề đó làm cho việc tải xuống một trang web trở thành một trải nghiệm tốn kém vì người dùng phải đợi các tệp lớn tải xuống — bao gồm các tệp ban đầu không hiển thị — trước khi xem một trang web. Đây là nơi WordPress lazy load xuất hiện
Lazy Loading là gì và nó hoạt động như thế nào?Lazy loading là một kỹ thuật tối ưu hóa giúp tải nội dung hiển thị nhưng làm chậm quá trình tải xuống và hiển thị nội dung xuất hiện dưới màn hình đầu tiên. Đó chỉ là thứ mà Google rất hào hứng và đó là một kỹ thuật bạn nên xem xét nếu các bài đăng và trang của bạn bao gồm nhiều video được nhúng và hình ảnh có độ phân giải cao Lazy loading hoạt động như thế này
Kết quả cuối cùng là hình ảnh không được tải xuống và video được tải xuống cho đến khi chúng thực sự cần thiết. Điều này có thể mang lại hiệu suất tăng đáng kể cho các trang web bao gồm nhiều hình ảnh có độ phân giải cao và video được nhúng Tải chậm có thể ảnh hưởng sâu sắc đến tốc độ trang web nếu bạn sử dụng nhiều hình ảnh. 🚀Nhấp để TweetXem cách Kinsta chống lại đối thủ. So sánh WordPress lười tảiCũng như rất nhiều vấn đề về hiệu suất trang web khác, khi nói đến WordPress lazy load, có một plugin mà bạn có thể sử dụng để khắc phục sự cố. Trên thực tế, có rất nhiều plugin miễn phí có sẵn trong thư mục plugin WordPress có thể được sử dụng để tải chậm hình ảnh và video. Sau khi xem xét vài tá plugin và thử nghiệm một vài plugin, chúng tôi đã xác định được 5 plugin tạo ra sự cải thiện đáng kể về hiệu suất trang web. Nếu bạn đã sẵn sàng triển khai lazy loading, hãy bắt đầu bằng cách xem xét năm tùy chọn sau Hình ảnh và video có thực sự làm chậm trang web không?Trước hết, trước khi bạn tải bất kỳ hình ảnh nào lên WordPress, hãy đảm bảo rằng bạn đã tối ưu hóa chúng Chúng tôi cần điểm số cơ bản để có thể thấy tác động của việc thêm hình ảnh và video. Không có ý nghĩa gì trong việc khắc phục sự cố nếu không có vấn đề gì bắt đầu. Để kiểm tra mọi thứ, tôi đã thiết lập cài đặt WordPress tiêu chuẩn trên tài khoản lưu trữ Kinsta. TwentySixteen là chủ đề đang hoạt động và không có plugin hoặc kỹ thuật tối ưu hóa nào như bộ nhớ đệm đã được triển khai Đây là cách kiểm tra tốc độ trang web Pingdom đánh giá trang web trước khi thêm bất kỳ hình ảnh hoặc video nào Như bạn có thể thấy, trang này rất nhẹ chỉ dưới 155 kb và tải trong chưa đầy nửa giây. Khó tìm ra lỗi với những điểm số đó. Điều gì xảy ra nếu chúng tôi tải lên một trang có tệp hình ảnh lớn và video YouTube được nhúng? Kích thước trang đã tăng lên 1. 7 MB và thời gian tải trang gần như tăng gấp ba lần chỉ còn dưới 1. 3 giây. TwentySixteen là một chủ đề ánh sáng được viết tốt, vì vậy ngay cả khi có thêm nửa tá hình ảnh và video YouTube, trang web này vẫn khá nhẹ và tải ánh sáng nhanh. Tuy nhiên, chúng ta có thể thấy việc thêm ảnh và video vào đã làm dung lượng trang lớn hơn rất nhiều và làm chậm tốc độ tải trang đi đáng kể Cải thiện tốc độ tải trang với các plugin Lazy LoadingHai plugin giúp tăng tốc đáng kể việc phân phối trang web này là a3 Lazy Load và Lazy Load. Hãy xem lần lượt từng người thực hiện như thế nào. Một số plugin bổ sung cũng đã được thử nghiệm nhưng không tạo ra sự cải thiện đáng kể về hiệu suất trang web. Khi bạn dùng thử các plugin tải chậm, hãy đảm bảo thực hiện kiểm tra trước và sau để đảm bảo rằng chúng đang tạo ra kết quả mà bạn đang tìm kiếm a3 Lười tảia3 Lazy Load là một tùy chọn lazy load phổ biến khác của WordPress trong kho lưu trữ. Plugin này đang hoạt động trên hơn 50.000 trang web WordPress và đã đạt được xếp hạng rất cao là 4. 7 trên 5 sao và đã nhận được gần 40 đánh giá của người dùng Kích hoạt plugin sẽ thêm menu cài đặt tại Cài đặt > a3 Lazy Load. Đối với mục đích thử nghiệm, tôi để nguyên cài đặt mặc định với một ngoại lệ. Tôi đã sử dụng tùy chọn Đang tải màu nền để khớp màu giữ chỗ với màu nền của trang web. Với thay đổi đó được thực hiện và cài đặt mặc định được áp dụng, trang web đã hoạt động rất tốt Chúng tôi quay trở lại thời gian tải trang dưới nửa giây. Điều đó thật đáng chú ý khi xem xét số lượng hình ảnh và video có trên trang web này Đăng kí để nhận thư mớiBạn muốn biết làm thế nào chúng tôi tăng lưu lượng truy cập của mình hơn 1000%?Tham gia cùng hơn 20.000 người khác nhận bản tin hàng tuần của chúng tôi với các mẹo nội bộ về WordPress Theo dõi ngaySo sánh kết quả kiểm tra Không còn nghi ngờ gì nữa, bạn sẽ nhận thấy rằng kích thước trang và số lượng yêu cầu đã giảm đáng kể. Điều gì tạo ra sự khác biệt đáng kể đó? . Đầu tiên, đây là ảnh chụp kích thước nội dung trông như thế nào khi a3 Lazy Load được kích hoạt Dung lượng hình ảnh rất nhỏ chỉ hơn 150 kb. Đây là giao diện của ảnh chụp màn hình nội dung với tổng trọng tải là 2. 0 MB Tập lệnh, HTML, CSS và các kích thước nội dung khác gần như giống hệt nhau. Tuy nhiên, kích thước hình ảnh là 1. 86 MB — về cơ bản là kích thước của phiên bản có độ phân giải đầy đủ của hình ảnh đầu tiên trên trang — thay vì chỉ 150 kb. Vì vậy những gì đang xảy ra? Như tôi đã đề cập trước đây, WordPress tự động cung cấp nhiều kích thước hình ảnh khác nhau và trình duyệt sẽ chọn và hiển thị phiên bản nhỏ nhất có thể dựa trên kích thước mà hình ảnh sẽ được hiển thị trên màn hình. A3 Lazy Load giữ nguyên hành vi mặc định của WordPress và kết quả là một tệp hình ảnh nhỏ hơn nhiều được phân phối Lười tảiTùy chọn thứ 2 là Lazy Load, đây là một plugin miễn phí được tạo bởi nhóm tại WP Rocket. Nó hiện đang hoạt động với hơn 10.000 lượt cài đặt với xếp hạng 4 trên 5 sao. Nếu bạn đang tìm kiếm một tùy chọn tải chậm WordPress đơn giản với tốc độ tốt thì đây là một lựa chọn tuyệt vời Plugin này hoạt động trên hình thu nhỏ, tất cả hình ảnh trong nội dung bài đăng hoặc trong văn bản widget, hình đại diện và mặt cười. Ưu điểm lớn của plugin này là không có thư viện JavaScript nào như jQuery được sử dụng và tập lệnh nặng dưới 10 KB. Không có tùy chọn để định cấu hình, chỉ cần cài đặt plugin và lazy loading sẽ hoạt động đơn giản Đấu tranh với thời gian chết và các vấn đề về WordPress? . Kiểm tra các tính năng của chúng tôi Tải lười biếng gốcTrong vài năm qua, đã có một nỗ lực để tích hợp chức năng lazy loading trực tiếp vào các trình duyệt web. Tại thời điểm này, tính năng tải chậm gốc có sẵn trong các trình duyệt dựa trên Chromium như Chrome và Brave, cũng như Firefox Tải chậm tự nhiên rất tốt cho hiệu suất trang web vì nó không phụ thuộc vào mã Javascript nội tuyến hoặc tập lệnh bên ngoài. Để thêm tải chậm tự nhiên vào trang web của bạn, chỉ cần thêm thuộc tính Google đã phát triển plugin Native Lazyload để giúp quá trình này dễ dàng hơn. Sau khi kích hoạt plugin, WordPress sẽ tự động chèn thuộc tính Tải chậm cho videoNếu bạn chỉ quan tâm đến việc tải chậm video, chúng tôi cũng khuyên bạn nên xem plugin Tải chậm cho video. Mặc dù một số plugin ở trên cũng làm được điều này, nhưng đây là một giải pháp tuyệt vời chỉ dành cho nội dung video Lazy Loading ảnh hưởng đến SEOCho dù bạn sử dụng plugin nào để tải chậm WordPress, điều quan trọng là bạn không làm hại SEO của mình. Có hai điều bạn cần kiểm tra lại
Tóm lượcVới sự hỗ trợ tải chậm gốc trên trình duyệt rộng rãi sắp ra mắt, chúng tôi khuyên bạn nên sử dụng một plugin như Google’s Native Lazy Load để đặt đường cơ sở tải chậm cho trang web của bạn Với sự hỗ trợ của Chrome và Firefox cũng như hỗ trợ Safari trong tương lai, tải chậm gốc của trình duyệt sẽ là tất cả những gì bạn cần để tải chậm hình ảnh và khung nội tuyến của mình. Như đã nói, nếu bạn đang tìm kiếm một tùy chọn dựa trên JavaScript cũng nhắm mục tiêu đến các trình duyệt cũ hơn, thì a3 Lazy Load là một tùy chọn tuyệt vời Lazy loading chỉ là một kỹ thuật bạn có thể sử dụng để tối ưu hóa trang web WordPress của mình. Tuy nhiên, nó có khả năng ảnh hưởng sâu sắc đến tốc độ trang web nếu bạn sử dụng nhiều hình ảnh và video. Tuy nhiên, khi bạn đã triển khai tải chậm, có một số kỹ thuật bổ sung mà bạn có thể xem xét và triển khai để mang lại hiệu suất trang web nhanh nhất có thể Chúng tôi có bỏ lỡ bất kỳ giải pháp lazy load WordPress tốt nào khác không? Nhận tất cả các ứng dụng, cơ sở dữ liệu và trang web WordPress của bạn trực tuyến và dưới một mái nhà. Nền tảng đám mây hiệu suất cao, đầy đủ tính năng của chúng tôi bao gồm
Hãy tự kiểm tra với $20 trong tháng đầu tiên của Lưu trữ ứng dụng hoặc Lưu trữ cơ sở dữ liệu. Khám phá kế hoạch của chúng tôi hoặc nói chuyện với bộ phận bán hàng để tìm thấy sự phù hợp nhất của bạn |
