PerformanceNguyên tắc: đo trước khi sửa — xác định chậm ở khâu nào (server, network hay render) rồi mới optimize.
- Chạy Lighthouse / PageSpeed Insights — lấy tổng quan LCP/INP/CLS và danh sách opportunities; PageSpeed có cả field data từ user thật (CrUX).
- DevTools Network tab — đọc waterfall: TTFB cao → vấn đề nằm ở server/DB/thiếu CDN; nhiều request lớn → ảnh chưa tối ưu, bundle to, third-party scripts.
- DevTools Performance tab — record quá trình load: long tasks chặn main thread, resource render-blocking, layout shifts.
- Thủ phạm thường gặp — ảnh không nén/sai kích thước, JS bundle lớn chưa code-split, web font chặn render, thiếu cache/CDN, API response chậm.
- Sửa theo impact — xử lý phần chiếm nhiều thời gian nhất trong waterfall trước; đo lại sau mỗi thay đổi; xác nhận bằng field data thay vì chỉ lab data.
Trình bày theo trình tự đo → khoanh vùng → sửa → đo lại cho thấy tư duy hệ thống, thay vì liệt kê mẹo rời rạc.