JavaScript thường được sử dụng để xây dựng các trang web Thương mại điện tử, hay còn gọi là trang EC, nhằm thu hút nhiều người dùng hơn và nâng cao trải nghiệm mua sắm trực tuyến. Tuy nhiên, Javascript cũng gây nên nhiều vấn đề về hiệu suất trên các trang EC. Hiểu được khó khăn đó, GCT Solution đề xuất 6 phương pháo giúp bạn tối ưu hóa trang wev thương mại điện tử với JavaScript.
Javascript là một ngôn ngữ lập trình được hỗ trợ bởi nhiều trình duyệt web. Javascript cho phép các nhà phát triển web viết mã có thể phản ứng được phản ứng với tương tác của người dùng, thao tác đánh dấu HTML trên một trang để thay đổi những gì người dùng nhìn thấy. Javascript có thể tạo ra nhiều tương tác người dùng đa dạng và phức tạp hơn so với chỉ đánh dấu HTML gốc.
Ví dụ: một giỏ hàng nhỏ trên một trang web thương mại điện tử thường được thực hiện bằng cách sử dụng Javascript. Biểu tượng giỏ hàng hiển thị số lượng và nội dung của các mặt hàng trong “giỏ hàng”, cho phép người dùng xem và điều chỉnh “giỏ hàng” của riêng họ.
Trình đơn điều hướng nâng cao cũng thường được tạo bởi Javascript. Javascript cũng có thể được sử dụng để thu thập phân tích trang web để cung cấp cho bạn thông tin chi tiết hơn về hiệu suất của trang.
Số lượng tệp Javascript có thể tăng không kiểm soát được, đặc biệt là trong trường hợp mỗi thành phần UI được giữ trong một tệp riêng biệt. Có một số công cụ miễn phí để sử dụng nếu trang web của bạn có quá nhiều tệp Javascript. Bạn có thể thử PageSpeed Insights, kết hợp cả dữ liệu từ người dùng thực và thử nghiệm trong phòng thí nghiệm
Để sử dụng PageSpeed Insights, chỉ cần nhập URL của một trang trên trang web công khai của bạn. Phần “cơ hội” của báo cáo PageSpeed Insights đề xuất chi tiết các khuyến nghị cụ thể cho trang. Ví dụ: Bạn nên giữ số lượng yêu cầu thấp và kích thước truyền nhỏ; từ đó, khi mở rộng, bạn có thể tóm tắt số lượng và kích thước của các loại tài nguyên được yêu cầu, bao gồm các tệp Javascript.
Có nhiều kỹ thuật khác nhau có thể được sử dụng để giảm số lượng tệp cần tải xuống, nhưng việc giải quyết vấn đề còn phụ thuộc vào tính linh hoạt của nền tảng hoặc công cụ bạn đang sử dụng. Ví dụ, nhiều hệ thống quản lý nội dung (CMS) hạn chế quyền truy cập vào Javascript để đơn giản hóa nhiệm vụ của người tạo nội dung và giảm nguy cơ sai sót. Nếu bạn có một số lượng lớn các tệp Javascript nhỏ, bạn nên kết hợp các tệp đó với nhau để có một tệp lớn hơn khi tải xuống.
Trong thực tế, bạn nên nhóm các tệp vào một vài tệp lớn hơn có thể được tải xuống song song. Nếu bạn có quyền kiểm soát các tệp Javascript trên trang web của mình, bạn có thể tìm thấy các công cụ nhóm Javascript, chẳng hạn như Webpack, để đơn giản hóa quá trình này. Lưu ý rằng việc hỗ trợ HTTP2 trên trang web của bạn có thể cải thiện hiệu suất mà không cần các tệp, bởi HTTP2 làm tăng hiệu quả tải xuống nhiều tệp nhỏ, do đó cải thiện các trang web thương mại điện tử sử dụng Javascript.
Mẹo thứ hai là tránh quá nhiều truy vấn DNS cho các tệp Javascript tham chiếu. Nếu các tệp Javascript được tải từ các tên miền khác nhau, có thể có tổng chi phí tra cứu DNS cho mỗi tên miền được tham chiếu. Nếu quá mức, điều này có thể làm chậm lần truy cập trang web đầu tiên của người dùng. Các báo cáo như PageSpeed Insights có thể hiển thị cho bạn danh sách tên miền được sử dụng trong URL trong các phần như giảm thời gian thực thi Javascript.
Sử dụng tab mạng bên trong Công cụ dành cho nhà phát triển của Chrome cũng là một cách đáng tin cậy để xem tất cả tên miền được tham chiếu. Nhưng không giống như cookie, bạn không thể dễ dàng yêu cầu xóa bộ nhớ cache DNS, làm cho các vấn đề DNS khó phát hiện hơn.
Để giảm tra cứu DNS, hãy cân nhắc xem có lưu trữ bản sao của các tệp Javascript được tham chiếu bên ngoài trên trang web Thương mại điện tử của bạn hay không. Không có câu trả lời chính xác cho câu hỏi có nên tự lưu trữ tệp Javascript hay không. Khi một Thư viện Javascript phổ biến được tải xuống từ một trang web trung tâm, nó có thể đã có trong bộ nhớ cache của trình duyệt, bởi vì người dùng truy cập một số trang web khác cũng sử dụng cùng một thư viện. Đặt một bản sao trên trang web của riêng bạn có thể tiết kiệm cho bạn tra cứu DNS, nhưng dẫn đến chi phí tải xuống tệp trên mỗi giây lớn hơn.