Phân tích nguyên nhân memory leak trong ứng dụng web React production

Bộ prompt giúp bạn yêu cầu AI đóng vai kỹ sư performance/debugging để truy tìm memory leak trong React production. Nội dung tập trung vào phân tích triệu chứng, khoanh vùng nguyên nhân, đề xuất cách đo đạc, tái hiện, xác minh và đưa ra hướng sửa ưu tiên cao mà không phụ thuộc vào một công cụ AI riêng biệt.
Lượt xem 31
AI sử dụng
ChatGPT Gemini Claude

Mục tiêu

Prompt này được thiết kế để hỗ trợ phân tích nguyên nhân memory leak trong ứng dụng web React chạy ở môi trường production. AI sẽ giúp bạn tiếp cận vấn đề theo hướng có cấu trúc: đọc triệu chứng, đặt giả thuyết, xác định thành phần nghi ngờ, đề xuất cách đo và kiểm chứng, rồi đưa ra phương án khắc phục theo mức độ ưu tiên.

Đây là lựa chọn phù hợp khi bạn gặp các tình huống như tab trình duyệt dùng RAM tăng dần theo thời gian, hiệu năng giảm sau nhiều lần điều hướng, component unmount nhưng tài nguyên vẫn không được giải phóng, hoặc có dấu hiệu rò rỉ từ listener, timer, subscription, cache, closure hay thư viện bên thứ ba.

Khi nào nên dùng

  • Khi ứng dụng React production bị tăng bộ nhớ sau một thời gian sử dụng.
  • Khi người dùng phản ánh tab bị chậm, đơ hoặc crash sau nhiều thao tác lặp lại.
  • Khi cần AI hỗ trợ đọc log, mô tả hành vi, code nghi ngờ hoặc kết quả profiling.
  • Khi muốn tạo quy trình điều tra rõ ràng trước khi sửa lỗi trên môi trường thật.
  • Khi cần ưu tiên các giả thuyết có khả năng cao thay vì kiểm tra tràn lan.

Hướng dẫn tùy biến

1. Cung cấp bối cảnh kỹ thuật

Hãy thêm thông tin như phiên bản React, framework đang dùng, thư viện state management, router, công cụ analytics, WebSocket, polling, iframe, chart, map, editor hoặc thư viện UI nặng. Bối cảnh càng rõ, AI càng đưa ra giả thuyết sát thực tế hơn.

2. Mô tả triệu chứng quan sát được

Nên nêu rõ bộ nhớ tăng ở bước nào, sau bao lâu, sau thao tác gì, có giảm khi rời màn hình hay không, có liên quan đến route cụ thể hay component cụ thể không. Nếu có số liệu từ Chrome DevTools, Performance, Memory, heap snapshot hoặc timeline thì nên chèn vào.

3. Dán code hoặc pseudo-code tối thiểu

Ưu tiên các đoạn liên quan đến useEffect, event listener, setInterval, setTimeout, fetch, AbortController, subscription, observer, ref, portal, cache, global store, memoization, virtualized list, lazy loading hoặc cleanup function. Nếu không tiện gửi toàn bộ mã nguồn, hãy gửi phần rút gọn nhưng vẫn giữ được luồng gây lỗi.

4. Yêu cầu đầu ra cụ thể

Bạn có thể yêu cầu AI trả lời theo bảng hoặc danh sách gồm: dấu hiệu, nguyên nhân khả dĩ, mức độ tin cậy, cách kiểm chứng, cách sửa, rủi ro sau khi sửa. Cách đặt yêu cầu rõ ràng sẽ giúp kết quả dễ chuyển thành checklist kỹ thuật cho đội phát triển.

Lưu ý

  • Memory leak trong React không phải lúc nào cũng nằm ở React; nguyên nhân có thể đến từ thư viện bên ngoài, DOM API, closure giữ tham chiếu, cache không giới hạn hoặc luồng bất đồng bộ không được hủy.
  • Nên xem AI như một trợ lý phân tích, không thay thế profiling thực tế bằng DevTools, heap snapshot, allocation instrumentation hoặc monitoring production.
  • Nếu làm việc với production, tránh chia sẻ dữ liệu nhạy cảm; hãy ẩn token, thông tin người dùng, endpoint nội bộ và log chứa dữ liệu riêng tư.
  • Khi AI đề xuất sửa lỗi, hãy yêu cầu kèm bước xác minh sau fix để chắc chắn bộ nhớ được giải phóng đúng như kỳ vọng.

Nội dung Prompt

Bạn cần đăng nhập để xem đầy đủ nội dung Prompt.

Có thể bạn quan tâm

Sản phẩm nổi bật