Share This
//Tối ưu tốc độ website với Asynchronous và Deferred Javascript

Tối ưu tốc độ website với Asynchronous và Deferred Javascript

Hầu hết, nếu không nói là tất cả website ngày nay đều sử dụng quá nhiều Javascript. Các nút social media? Các Plugin? Thậm chí là theme? 90% trường hợp đều có chèn script. Bạn đang chạy script. Script làm chậm tốc độ tải trang. Sau đây là 2 plugin giúp giải quyết vấn đề.
Ghi chú từ Webmaster

 

Asynchronous và Deferred

Ba điều cần ghi nhớ:

  1. Parser về cơ bản là HTML trong giai đoạn load
  2. Net là thời lượng script từ khi được gọi đến khi load xong
  3. Execution là thời lượng script hoạt động trên trình duyệt người dùng.

Về cơ bản, quy trình thông thường của 1 website là tạm dừng parse HTML trong khi script đang chạy. Nếu web của bạn giống tôi, đồng nghĩa với độ trễ rất lớn trước khi ngời dùng có thể nhìn thấy phần HTML (code chính của website, thiết kế, nội dung v.v…). Đây là quy trình thông thường khi load script:


Deferring script đơn giản là để HTML load trên trình duyệt người dùng trước khi cho chạy script.  Cái lợi là website sẽ ngay lập tức xuất hiện trên trình duyệt người dùng – khiến người ta nghĩ tốc độ load cực kì nhanh. Lời khuyên là dùng deferred trong trường hợp 1 số người dùng không dùng trình duyệt có hỗ trợ asynchronous load script. Deferred script sẽ trông thế này:

Asynchronous load script là lựa chọn tốt nhất. Parse HTML và load các script sẽ được thực thi nhưng script chỉ execute khi nó sẵn sàng. Chiếm ít thời gian tải nhất. Tuy nhiên, không phải trình duyệt nào cũng hỗ trợ Asynchronous load scritp. Đây là quy trình hoạt động của Asynchronous:

Dĩ nhiên lời khuyên của tôi là tối ưu script của bạn bằng cả Deferred và Asynchronous. Có thể thực hiện theo hướng dẫn trên: W3C Editor’s Draft (HTML 5.1 nightly).

Có 3 chế độ để lựa chọn khi dùng các attribute này. Nếu thuộc tính async được sử dụng, script sẽ được execute không đồng bộ (asynchronously), ngay khi nó sẵn sàng. Nếu thuộc tính async không tồn tại nhưng có thuộc tính defer, script sẽ được execute khi trang đã hoàn thành parsing. Nếu cả 2 thuộc tính trên đều không tồn tại, script sẽ được fetch và execute ngay lập tức, trước khi user-agent tiếp tục parse trang web.

 

Phải bắt đầu từ đâu?

Vì Asynchronous Javascript là lựa chọn tốt nhất, chúng ta sẽ vào WordPress plugin tìm Asynchronous Javascript.

Click here to go to the plugin page. Tải về, cài đặt và nó sẽ sẵn sàng hoạt động. Nó có thể gây xung đột với 1 số plugin của bạn – đặt biệt nếu dùng Slider. Trong phần setting của WordPress back-end sẽ có 1 option để tùy chỉnh sau khi cài. Có thể loại trừ những script mà bạn không muốn Asynchronous  Javascript can thiệp.

Tiếp theo là Deferred Javascript. Tôi đã tìm hiểu và có vẻ các plugin có cùng tên gọi là tốt nhất. Plugin Deferred Javascript mà tôi khuyên dùng là WP Deferred Javascript.

Click here to go to the WP Deferred Javascripts Plugin page. Tải và cài đặt nó. Nó không có option nào để giúp cuộc đời bạn dễ thở hơn. Nó sẽ có ích khi trình duyệt của người dùng không support được Asynchronous Javascript.

Tham khảo: seo-hacker.com


ỨNG TUYỂN







    Chế độ phúc lợi

    CHÍNH SÁCH LƯƠNG & THƯỞNG

    Thấu hiểu tâm tư nguyện vọng của nhân viên, công ty Rivercrane Việt Nam đặc biệt thiết lập chế độ xét tăng lương định kỳ 2lần/năm. Xét đánh giá vào tháng 06 và tháng 12 hàng năm và thay đổi lương vào tháng 01 và tháng 07 hàng năm. Ngoài ra, nhân viên còn được thưởng thành tích định kỳ cho các cá nhân xuất sắc trong tháng, năm.

    CHẾ ĐỘ ĐÀO TẠO TẠI NHẬT

    Luôn luôn mong muốn các kỹ sư và nhân viên trong công ty có cái nhìn toàn diện về lập trình những mảng kỹ thuật trên thế giới, công ty Rivercrane Việt Nam quyết định chế độ 3 tháng 1 lần đưa nhân viên đi học tập tại Nhật. Các bạn kỹ sư hoàn toàn đều có thể quyết định khả năng phát triển bản thân theo hướng kỹ thuật hoặc theo hướng quản lý.

    CHẾ ĐỘ ĐI DU LỊCH HÀNG NĂM

    Không chỉ đưa đến cho nhân viên những công việc thử thách thể hiện bản thân, công ty Rivercrane Việt Nam muốn nhân viên luôn thích thú khi đến với những chuyến hành trình thú vị hàng năm. Những buổi tiệc Gala Dinner sôi động cùng với những trò chơi Team Building vui nhộn sẽ giúp cho đại gia đình Rivercrane thân thiết hơn.

    CHẾ ĐỘ EVENT CÔNG TY

    Những hoạt động Team building, Company Building, Family Building, Summer Holiday, Mid-Autumn Festival… sẽ là những khoảnh khắc gắn kết đáng nhớ của mỗi một nhân viên trong từng dự án, hoặc sẽ là những điều tự hào khi giới thiệu công ty mình với với gia đình thân thương, cùng nhau chia sẻ yêu thương với thông điệp “We are One”

    BẢO HIỂM

    Công ty Rivercrane Việt Nam đảm bảo tham gia đầy đủ chế độ Bảo hiểm xã hội, bảo hiểm y tế và bảo hiểm thất nghiệp. Cam kết chặt chẽ về mọi thủ tục phát sinh công ty đều hỗ trợ và tiến hành cho nhân viên từ đầu đến cuối. Những chế độ bảo hiểm khác công ty cũng đặc biệt quan tâm và từng bước tiến hành.

    CHẾ ĐỘ PHÚC LỢI KHÁC

    Hỗ trợ kinh phí cho các hoạt động văn hóa, văn nghệ, thể thao; Hỗ trợ kinh phí cho việc mua sách nghiên cứu kỹ thuật; Hỗ trợ kinh phí thi cử bằng cấp kỹ sư, bằng cấp dành cho ngôn ngữ. Hỗ trợ kinh phí tham gia các lớp học về quản lý kỹ thuật bên ngoài; Các hỗ trợ phúc lợi khác theo quy định công ty…

    CÔNG VIỆC TƯƠNG TỰ

    © 2012 RiverCrane Vietnam. All rights reserved.

    Close