INP là gì?
INP, viết tắt của Interaction to Next Paint, là chỉ số Core Web Vitals đo thời gian từ lúc người dùng nhấp, chạm hoặc nhấn phím đến khi trình duyệt hiển thị phản hồi trực quan tiếp theo. INP quan sát các tương tác trong suốt lượt truy cập, không chỉ lần đầu. Mốc tốt là không quá 200 mili giây ở phân vị thứ 75.[1]
Bạn bấm mở menu nhưng màn hình vẫn im lặng. Bạn nhấp nút gửi form thêm lần nữa vì không biết lần đầu đã được ghi nhận chưa. Hoặc chữ xuất hiện chậm hơn nhịp gõ. Trang có thể tải nội dung nhanh nhưng những khoảnh khắc đó vẫn khiến người dùng cảm thấy website bị đơ. Đó chính là trải nghiệm mà INP muốn phản ánh.
Trước khi đi vào chi tiết, nếu bạn chưa nắm phần nền, xem thêm technical SEO là gì.
- Xác nhận vấn đề bằng Field Data ở cấp URL hoặc nhóm URL.
- Tìm đúng thao tác chậm bằng RUM hoặc hành trình người dùng.
- Ghi Performance trace khi tái hiện thao tác đó.
- Tách độ trễ thành input delay, processing và presentation delay.
- Sửa nguyên nhân có tác động lớn nhất rồi kiểm thử hồi quy.
- Theo dõi lại INP P75 trên dữ liệu người dùng thật.
INP bao nhiêu là tốt?
Google đánh giá INP ở phân vị thứ 75 của lượt tải trang, tách mobile và desktop. Có thể hiểu đơn giản rằng ít nhất 75% lượt xem cần đạt ngưỡng tương ứng. Không dùng điểm trung bình toàn site để kết luận vì nó có thể che khuất nhóm người dùng đang gặp phản hồi chậm.
| Mức đánh giá | Giá trị INP | Người dùng cảm nhận | Hành động |
|---|---|---|---|
| Tốt | ≤ 200 ms | Phản hồi nhanh và liền mạch | Duy trì, theo dõi hồi quy |
| Cần cải thiện | > 200 đến 500 ms | Bắt đầu nhận thấy độ trễ | Tìm interaction và template gây chậm |
| Kém | > 500 ms | Dễ tưởng trang bị lỗi hoặc không nhận thao tác | Ưu tiên sửa luồng kinh doanh quan trọng |
INP đo điều gì trong một tương tác?
Một interaction có thể gồm nhiều event cùng thuộc một cử chỉ. Ví dụ, một lần chạm có thể tạo ra pointerdown, pointerup và click. INP không cộng mọi event một cách máy móc. Nó ghi nhận khoảng thời gian dài nhất của nhóm event điều khiển tương tác, từ lúc người dùng bắt đầu thao tác đến khi trình duyệt có thể vẽ khung hình tiếp theo.
Input delay: thao tác đã xảy ra nhưng callback chưa chạy. Input delay bắt đầu khi người dùng thao tác và kết thúc lúc event callback đầu tiên được thực thi. Main thread có thể đang bận parse JavaScript, chạy hydration, thực hiện analytics hoặc xử lý một long task khác. Đây là lý do menu đôi khi không mở khi người dùng nhấp trong những giây đầu, dù nội dung đã xuất hiện trên màn hình.
Processing duration: callback đang làm quá nhiều việc. Processing duration là thời gian chạy các callback của interaction. Một nút gửi form có thể vừa validate toàn bộ dữ liệu, vừa cập nhật state cấp cao, vừa gửi tracking, rồi render lại component cha. Người dùng chỉ cần thấy nút đổi trạng thái ngay, nhưng luồng chính lại phải hoàn thành cả một chuỗi công việc trước khi giao diện có cơ hội phản hồi.
Presentation delay: code đã chạy xong nhưng chưa vẽ được. Sau callback, trình duyệt còn phải tính style, layout, paint và composite. DOM lớn, layout thrashing, bảng hàng nghìn dòng hoặc thay đổi state làm nhiều nhánh render lại đều có thể kéo dài giai đoạn này. Vì vậy, giảm thời gian xử lý JavaScript chưa chắc đủ nếu phần render vẫn quá nặng.
INP không đo những gì?
- Không đo cuộn, hover và zoom: INP tập trung vào nhấp chuột, chạm màn hình và bàn phím.
- Không chờ toàn bộ network request: nếu giao diện phản hồi trước rồi API chạy bất đồng bộ, request đó thường không kéo dài INP.
- Không đo thời gian tải nội dung chính: đó là vai trò gần hơn với LCP.
- Không phải thời gian xử lý trung bình: phép đo hướng đến tương tác chậm nhất hoặc gần chậm nhất trong lượt truy cập.
INP khác FID và TBT như thế nào?
| Chỉ số | Đo gì? | Nguồn dữ liệu | Dùng để làm gì? |
|---|---|---|---|
| INP | Độ trễ từ tương tác đến khung hình tiếp theo trong cả lượt truy cập | Field Data hoặc lab có thao tác | Đánh giá khả năng phản hồi thực tế |
| FID | Chỉ input delay của tương tác đầu tiên | Field Data | Chỉ số cũ, đã được INP thay thế |
| TBT | Tổng thời gian main thread bị chặn bởi phần vượt quá 50 ms của long task | Lab Data | Proxy giúp tìm nguy cơ, không thay thế INP |
INP chính thức thay FID trong Core Web Vitals từ ngày 12/03/2024. Khác biệt quan trọng nhất là phạm vi. FID chỉ xem input delay ở lần tương tác đầu. INP nhìn cả input delay, processing, presentation delay và quan sát gần như toàn bộ hành trình.[2]
Cách đo INP đúng theo 4 lớp dữ liệu
- Search Console: báo cáo Core Web Vitals dùng dữ liệu CrUX để nhóm các URL có trải nghiệm tương tự. Nó trả lời “template nào đang bị ảnh hưởng?” nhưng không chỉ ra nút bấm nào gây chậm.
- PageSpeed Insights: nhập URL canonical cụ thể rồi xem báo cáo đang hiển thị dữ liệu của chính URL hay dữ liệu cấp origin. Nếu URL chưa đủ mẫu, kết quả origin chỉ cho biết bức tranh chung của tên miền.
- RUM: CrUX cho biết mức độ, Real User Monitoring cho biết ngữ cảnh. Thư viện
web-vitalscủa Google cung cấp cách triển khai tham chiếu để thu thập INP theo P75, template, thiết bị và interaction target.[3] - Chrome DevTools: mở Performance panel, thực hiện hành trình giống người dùng thật rồi ghi trace khi gặp interaction chậm.[4]
Cách tối ưu INP theo đúng nguyên nhân
| Dấu hiệu trong trace | Nguyên nhân thường gặp | Hướng xử lý | Cách xác nhận |
|---|---|---|---|
| Input delay dài | Main thread bị long task chiếm dụng | Giảm JS khởi tạo, chia task, trì hoãn widget không quan trọng | Callback bắt đầu sớm hơn |
| Processing dài | Event handler làm quá nhiều việc đồng bộ | Ưu tiên phản hồi giao diện, dời analytics và việc không khẩn cấp | Callback và call tree ngắn hơn |
| Presentation dài | DOM lớn, forced layout hoặc render lan rộng | Thu hẹp update, virtualize danh sách, tránh layout thrashing | Style, layout và paint giảm |
| Chậm khi trang vừa mở | Hydration, tag manager hoặc bundle lớn | Giảm code ban đầu, defer script, hydrate theo nhu cầu | Tương tác khi tải phản hồi nhanh hơn |
| Chỉ chậm ở form hoặc filter | Validation, tìm kiếm hoặc state update theo từng phím | Giảm phạm vi tính toán, debounce đúng chỗ, dùng Web Worker khi cần | Interaction target hết nằm trong nhóm chậm |
Khi công việc đồng bộ dài, hãy chia nó thành các phần để main thread có cơ hội nhận input. Tuy nhiên, chia task không có nghĩa dùng hàng loạt timeout vô nghĩa. Giao diện cần được cập nhật trước, phần không khẩn cấp mới được nhường sang task tiếp theo. Tính toán CPU nặng và không cần DOM có thể chuyển sang Web Worker.[5]
Google khuyến nghị website đạt Core Web Vitals tốt để thành công trên Search, nhưng không có một tín hiệu “page experience” duy nhất. INP không phải nút bấm giúp một trang tự động tăng hạng, cũng không bù được nội dung sai intent.[6]
Mỗi site nghẽn tương tác ở một chỗ khác nhau: chỗ do theme, chỗ do tag manager chất chồng. Mô tả nền tảng đang dùng khi đăng ký tư vấn miễn phí, chúng tôi khoanh vùng nguyên nhân trước.
Đọc thêm: redirect 301 vs 302 · kiểm tra mobile friendly
Câu hỏi thường gặp về INP
Tại sao PageSpeed Insights không có INP của URL?
URL có thể chưa đủ dữ liệu người dùng trong Chrome UX Report, chưa có tương tác đo được hoặc lượng truy cập còn thấp. PageSpeed Insights có thể chuyển sang dữ liệu cấp origin. Khi đó, không nên tự suy ra riêng URL đã đạt mà cần bổ sung RUM và lab test.
SSR có tự động làm INP tốt hơn không?
Không. SSR hoặc prerender giúp nội dung ban đầu sẵn trong HTML, nhưng JavaScript hydration, event handler và render phía client vẫn có thể làm interaction chậm. Cần đo main thread và hành vi sau khi trang tải.
Nguồn tham khảo
- web.dev: Lượt tương tác đến nội dung hiển thị tiếp theo (INP), cập nhật ngày 02/09/2025.
- web.dev: INP chính thức trở thành Core Web Vital, ngày 12/03/2024.
- GoogleChrome: thư viện web-vitals.
- Chrome for Developers: phân tích hiệu suất bằng Performance panel.
- web.dev: Cách tối ưu hóa INP, cập nhật ngày 02/09/2025.
- Google Search Central: Core Web Vitals và kết quả tìm kiếm.