Cách giảm INP WordPress: nguyên nhân, đo lường, xử lý từng bước

Từ tháng 3/2024, Google chính thức thay FID bằng INP (Interaction to Next Paint) trong bộ Core Web Vitals. Với website WordPress, INP là chỉ số khó "qua môn" nhất — nhiều site có LCP và CLS đẹp nhưng INP đỏ rực vì plugin nặng, theme nhiều JavaScript, hoặc tracking script chèn vô tội vạ.

Bài viết này tập trung vào cách giảm INP WordPress thực chiến cho doanh nghiệp Việt Nam: nguyên nhân hay gặp, cách đo, quy trình xử lý từng bước, và checklist cụ thể cho người không phải developer.

INP là gì và vì sao website WordPress dễ bị INP cao?

INP đo độ trễ giữa lúc người dùng tương tác (click, tap, gõ phím) và lúc trình duyệt vẽ phản hồi tiếp theo lên màn hình. Khác với LCP đo tốc độ tải, INP đo "độ nhạy" của trang sau khi đã tải xong.

INP "tốt" khi ≤ 200 ms, "cần cải thiện" khi 200–500 ms, "kém" khi > 500 ms. Google dùng INP làm tín hiệu xếp hạng nhẹ trong Core Web Vitals.

INP khác gì FID?

FID (First Input Delay) chỉ đo độ trễ của tương tác đầu tiên trong phiên. INP đo toàn bộ tương tác trong phiên và lấy giá trị tệ nhất (thực tế lấy mức 98th percentile cho trang dài). Vì vậy INP "khắt khe" hơn FID rất nhiều — một trang FID đẹp vẫn có thể fail INP nếu lần click thứ 5, thứ 10 bị giật.

INP ảnh hưởng thế nào đến SEO và trải nghiệm người dùng?

Về SEO, INP là một yếu tố trong Core Web Vitals. Tác động không lớn như content quality nhưng đủ để tạo khác biệt giữa hai trang ngang điểm content. Về UX, INP cao đồng nghĩa người dùng cảm thấy trang "khựng", click không phản hồi ngay, dễ rời bỏ — đặc biệt trên mobile.

Site WordPress dễ bị INP cao vì 3 lý do: (1) hệ sinh thái plugin lớn, mỗi plugin chèn JS riêng; (2) page builder (Elementor, Divi) chèn nhiều layer DOM và animation; (3) chủ site thường gắn nhiều tracking script (GA, GTM, Facebook Pixel, TikTok, Hotjar) mà không phân loại quan trọng/không quan trọng.

Cách kiểm tra INP cho website WordPress

Trước khi tối ưu, phải đo. Đo sai chỗ thì sửa sai chỗ.

Kiểm tra bằng PageSpeed Insights

Vào pagespeed.web.dev → nhập URL → chạy. Cuộn xuống mục "Discover what your real users are experiencing" — đây là dữ liệu Field Data từ CrUX (28 ngày người dùng thực). Nếu thấy INP đỏ hoặc vàng, đây là số thật — phải xử lý.

Phía dưới là Lab Data (chạy mô phỏng). Lab Data có thể không phản ánh INP thực vì lab chỉ chạy 1 phiên ngắn, không có nhiều tương tác. Đừng chỉ dựa vào Lab.

Kiểm tra bằng Chrome DevTools

Mở Chrome → mở trang web → F12 → tab Performance → record → tương tác thật như user (click menu, mở popup, scroll) → stop. Trong kết quả, mục Interactions hiện tất cả tương tác và độ trễ INP của từng cái. Đây là cách phát hiện chính xác plugin/script nào đang gây giật.

Hoặc cài extension Web Vitals (do Google phát hành) để xem chỉ số trực tiếp khi duyệt trang.

Phân biệt dữ liệu Lab và Field Data

Lab Data đo trong môi trường mô phỏng (mạng 4G chuẩn, máy mid-tier) — hữu ích để tìm nguyên nhân kỹ thuật. Field Data là số liệu thực từ CrUX, lấy từ Chrome user thật — đây là số Google dùng để đánh giá INP của site bạn. Hai số này có thể chênh lệch lớn. Khi Field Data đỏ thì INP của bạn đang fail thật, không phụ thuộc vào việc Lab có đẹp hay không.

Nguyên nhân thường gặp khiến INP WordPress cao

Theme quá nặng

Nhiều theme đa năng (multi-purpose) như Avada, Bridge, The7 chèn rất nhiều CSS/JS không cần thiết. Mỗi trang load cả gói thư viện animation, slider, mega menu, dù bạn chỉ dùng một phần nhỏ. Hệ quả: main thread phải parse hàng trăm KB JS, mỗi tương tác phải chờ JS thread giải phóng.

Giải pháp: nếu site nhỏ, cân nhắc dùng theme nhẹ (GeneratePress, Astra, Kadence) + page builder. Nếu đang dùng theme nặng và không thể đổi, tìm option "disable unused features" trong theme settings.

Plugin tạo nhiều JavaScript

Plugin SEO, plugin form, plugin chat, plugin slider, plugin popup — mỗi cái chèn 50–200KB JS. Cộng dồn 10 plugin = 1–2MB JS chỉ cho frontend. WordPress không có cơ chế tự động defer/lazy nên tất cả chạy đồng thời.

Cách phát hiện: vào Query Monitor plugin → tab Scripts xem danh sách JS chèn vào từng trang. Hoặc dùng WP Asset CleanUp để disable script trên trang không cần (ví dụ form Contact Form 7 không cần load trên trang chủ).

Slider, popup, live chat, tracking script

Top 4 thủ phạm gây INP cao trên site SME Việt:

  • Slider (Revolution Slider, Smart Slider): load thư viện 200–400KB và liên tục chạy animation.
  • Popup (OptinMonster, Poptin): theo dõi event scroll/exit intent, chiếm main thread.
  • Live chat (Tawk.to, Crisp, Subiz, Tidio): load iframe + JS từ third-party, độ trễ phụ thuộc server bên đó.
  • Tracking script: GA, GTM, Facebook Pixel, TikTok Pixel, Hotjar, Microsoft Clarity, Google Ads remarketing — mỗi cái 30–80KB.

Server phản hồi chậm

Hosting yếu (TTFB > 800ms) làm mọi thứ đều chậm theo. Shared hosting giá rẻ thường có server overloaded, không có Redis cache, PHP-FPM ít workers. Nếu TTFB cao, không tối ưu frontend nào cứu được.

CSS/JS chưa tối ưu

Render-blocking CSS, JS không defer, không minify, không gzip — tất cả làm trình duyệt mất thời gian parse. Plugin cache như WP Rocket, LiteSpeed Cache, FlyingPress xử lý phần này tốt nếu cấu hình đúng.

Quy trình xử lý INP từng bước

Bước 1 — Sao lưu website trước khi tối ưu

Bắt buộc. Backup full file + database. Một thay đổi sai có thể làm vỡ giao diện hoặc mất chức năng. Dùng plugin UpdraftPlus, BackWPup, hoặc backup từ panel hosting. Lưu file backup ra ngoài hosting (Google Drive, Dropbox).

Bước 2 — Xác định trang có INP cao

Vào Google Search Console → Core Web Vitals → xem URL nào trong nhóm "Poor" hoặc "Needs improvement". Đây là trang có Field Data INP fail. Tập trung tối ưu các trang này trước, không tối ưu cào bằng.

Bước 3 — Tắt thử plugin nghi ngờ

Tắt từng plugin một, đo lại INP bằng Chrome DevTools sau mỗi lần. Trình tự ưu tiên: slider, popup, live chat, plugin tracking → form → SEO. Nếu INP giảm rõ rệt sau khi tắt một plugin, đó là thủ phạm. Cân nhắc thay plugin nhẹ hơn hoặc giảm tính năng.

Bước 4 — Delay/defer JavaScript không quan trọng

Plugin cache như WP Rocket có option "Delay JavaScript Execution" — mọi JS không đặt trong whitelist sẽ chỉ chạy sau khi user tương tác lần đầu (scroll, click, gõ phím). Đây là cách giảm INP nhanh nhất cho site WordPress.

Whitelist nên giữ: jQuery core, plugin chính, GA4 (nếu cần đo bounce ngay), navigation menu. Ngược lại, delay: chat widget, popup, social share, GTM, Facebook Pixel.

Bước 5 — Tối ưu theme, font, icon, animation

  • Font: dùng `font-display: swap` để text hiển thị ngay. Tải font local thay vì Google Fonts để tránh request external.
  • Icon: chuyển từ FontAwesome (200KB) sang SVG inline cho icon thực sự dùng.
  • Animation: tắt animation thừa (parallax, hover effect nặng) trên mobile.
  • Lazy load: ảnh, iframe, video phải lazy load. WordPress 5.5+ hỗ trợ native lazy load cho ảnh.

Bước 6 — Kiểm tra lại trên mobile

INP thường tệ hơn trên mobile vì máy yếu hơn. Sau khi tối ưu, đo lại bằng PageSpeed Insights tab "Mobile" hoặc Chrome DevTools với CPU throttle 4x. Đảm bảo INP ≤ 200ms ở mobile mới yên tâm.

Checklist giảm INP WordPress

Việc nên làm ngay (không cần dev)

1. Cài plugin cache mạnh (WP Rocket, LiteSpeed Cache nếu hosting LiteSpeed, hoặc FlyingPress). 2. Bật Delay JavaScript Execution. 3. Bật Lazy Load cho ảnh và iframe. 4. Minify HTML, CSS, JS. 5. Gỡ plugin không dùng đến trong 3 tháng gần nhất. 6. Tắt slider/popup nếu không thật sự tạo conversion. 7. Đặt tracking script (GA, GTM, Facebook) qua GTM thay vì chèn rời từng cái. 8. Dùng CDN (Cloudflare miễn phí cũng đủ với SME).

Việc cần developer xử lý

1. Audit plugin: kiểm tra plugin nào chèn JS không cần thiết, dùng `wp_dequeue_script` để gỡ trên trang không cần. 2. Tối ưu theme: gỡ CSS/JS thừa từ functions.php. 3. Critical CSS: tách CSS quan trọng inline vào `<head>`, phần còn lại load async. 4. Code splitting cho page builder nếu site lớn. 5. Database cleanup: xóa post revisions, transient hết hạn, spam comment.

Việc không nên làm vì dễ lỗi giao diện

1. Đừng minify Inline JS trong theme bằng tool tự động — dễ vỡ slider, mega menu. 2. Đừng combine all CSS thành 1 file nếu site dùng nhiều plugin có CSS conflict. 3. Đừng async toàn bộ JS — vài plugin (đặc biệt slider) cần load đồng bộ. 4. Đừng disable JavaScript của Critical Path — sẽ vỡ form, mega menu, search.

Khi nào nên thuê dịch vụ tối ưu tốc độ website?

Nếu sau 1–2 tuần làm theo checklist mà INP vẫn đỏ, vấn đề có thể nằm sâu ở: theme conflict, server cấu hình kém, hoặc plugin core của site đang viết sai. Lúc đó nên thuê người có kinh nghiệm — sẽ tiết kiệm thời gian và tránh phá vỡ chức năng đang chạy.

Trang Web Vàng cung cấp [dịch vụ tối ưu tốc độ website WordPress](/toi-uu-toc-do-website/) bao gồm audit toàn diện, tối ưu theme/plugin, cài plugin cache đúng cấu hình, tối ưu hosting/database. Phù hợp cho website doanh nghiệp đã chạy nhiều năm, plugin chồng chất, không thể tự gỡ.

Câu hỏi thường gặp

1. INP bao nhiêu là tốt cho website WordPress?

Theo Google Core Web Vitals: ≤ 200ms là "Good", 200–500ms là "Needs improvement", > 500ms là "Poor". Mục tiêu là giữ Field Data INP ≤ 200ms ở cả mobile và desktop. Site WordPress doanh nghiệp đạt được mức 150ms là đã rất tốt.

2. INP cao có làm tụt SEO không?

Có nhưng nhẹ. INP nằm trong Page Experience signals — Google dùng để xếp hạng giữa các trang có content tương đương. Tác động thực sự lớn là đến UX và bounce rate, gián tiếp ảnh hưởng SEO. Một website có content tốt nhưng INP đỏ vẫn rank được, chỉ là đang để mất lợi thế so với đối thủ tối ưu kỹ.

3. Plugin cache có giảm được INP không?

Có, nhưng chỉ một phần. Plugin cache giúp giảm TTFB và LCP rất tốt, nhưng INP phụ thuộc nhiều vào JavaScript runtime, không phải tốc độ tải. Để giảm INP, bật tính năng "Delay JavaScript" hoặc "Defer JS" trong plugin cache thay vì chỉ minify/combine.

4. Vì sao PageSpeed báo INP cao nhưng web nhìn vẫn nhanh?

Có 2 lý do: (a) bạn đang xem Lab Data, không phải Field Data — Lab có thể chênh thực tế; (b) máy của bạn mạnh hơn user thật. Phần lớn user Việt dùng mobile mid-range, mạng 4G — INP cảm nhận rất khác máy bạn dùng.

5. Có nên xóa plugin để giảm INP không?

Có, nhưng cẩn thận. Trước khi xóa, kiểm tra plugin có đang được dùng không (vào shortcode, widget, theme code). Nếu không dùng, deactivate trước, đợi 1 tuần xem có gì hỏng không, rồi mới uninstall. Plugin lớn có thể tạo bảng riêng trong database — uninstall không xóa bảng đó, cần dọn thủ công.


CTA: Website của bạn đang fail INP trên Core Web Vitals? Trang Web Vàng cung cấp dịch vụ audit + tối ưu tốc độ WordPress chuyên sâu, cam kết Core Web Vitals "Good" sau 14 ngày. Liên hệ tư vấn ngay.