Cách trì hoãn Script bên thứ 3 (Google Tag Manager, Facebook Pixel, Chat Widget) cứu điểm PageSpeed
Một thảm họa tốc độ phổ biến: Website của bạn code tay rất tối ưu nhưng điểm Google PageSpeed vẫn lẹt đẹt 30-40 điểm! Nguyên nhân đến từ việc nhồi nhét quá nhiều đoạn mã **Script bên thứ 3 (Third-party Scripts như Google Tag Manager, Facebook Pixel, Tawk.to Chat Widget, TikTok Pixel...)**. Các script này làm nghẽn luồng xử lý JavaScript chính (Main Thread Blocking Time).
1. Component next/script trong Next.js giải cứu tốc độ thế nào?
Next.js cung cấp component <Script /> với 3 chiến lược nạp mã (Loading Strategies) thông minh:
beforeInteractive: Nạp ngay lập tức trước khi trang interactive (chỉ dùng cho script cực kỳ quan trọng như nạp theme).afterInteractive: Nạp ngay sau khi trang đã tương tác được (mặc định cho GA4 Analytics).lazyOnload: Trì hoãn nạp script cho đến khi tất cả tài nguyên trang đã tải xong hoàn toàn và trình duyệt đang rảnh rỗi (Dành cho Facebook Pixel, Chat Widget).
2. Hướng dẫn sử dụng next/script với chế độ lazyOnload
import Script from 'next/script';
export default function RootLayout({ children }) {
return (
<html lang="vi">
<body>
{children}
{/* Nạp chậm Chat Widget hỗ trợ khách hàng không làm chậm web */}
<Script
src="https://embed.tawk.to/xyz/default"
strategy="lazyOnload"
/>
</body>
</html>
);
}
Kết luận
Trì hoãn các script bên thứ 3 thông minh bằng next/script sẽ cứu vớt điểm Google PageSpeed đạt 90+ xanh mượt. Uwmee Software tối ưu hóa 100% chiến lược nạp script cho website doanh nghiệp. Đọc thêm bài viết Security Headers cho Next.js.
Cần vượt Closed Testing nhanh chóng?
Đội 12+ tester thật của Uwmee tương tác hằng ngày đủ 14 ngày — trọn gói chỉ 300.000đ, chạy lại miễn phí nếu không đạt.