Prompt miễn phí
Prompt giải thích luồng dữ liệu React
Phân tích component React để hiểu dữ liệu đi qua props, state và điểm gây render lại; kèm gợi ý cải thiện.
Prompt dùng để làm gì?
Phân tích component React để hiểu dữ liệu đi qua props, state và điểm gây render lại; kèm gợi ý cải thiện.
Điền thông tin của bạn
Prompt
Input mẫu
Code component:
function UserList({ users, onSelect }) { const [filter, setFilter] = useState(''); ... }
Output mẫu
2) Render lại: khi filter đổi hoặc khi users từ cha đổi thì component render lại
3) Vấn đề: filter đặt đúng chỗ nhưng danh sách lọc lại mỗi render có thể tốn kém
4) Gợi ý: dùng useMemo cho danh sách đã lọc, tách item thành component con nếu cần
Cách sử dụng
Giải thích cấu trúc
Mẹo sử dụng
- Hãy yêu cầu mô tả thêm nếu component dùng context, reducer hoặc custom hook.
- Nếu có danh sách dài, kiểm tra khả năng lọc/sắp xếp gây render tốn kém.
- Phân biệt render do state nội bộ với render do props từ cha thay đổi.
Ứng dụng và bước tiếp theo
Phân tích component React để hiểu dữ liệu đi qua props, state và điểm gây render lại; kèm gợi ý cải thiện.
Tùy chỉnh theo dữ liệu đầu vào và kiểm tra lại kết quả trước khi sử dụng. Nội dung giả lập phải được ghi rõ là minh họa.
Nguồn và giấy phép
ONTER biên tập · original
Đánh giá prompt
Chọn số sao theo trải nghiệm của bạn. Bạn có thể sửa đánh giá sau một phút.
Prompt liên quan
Thiết kế kiến trúc tách lớp cho ứng dụng nhỏ dễ bảo trì
Đề xuất cách tách controller, service, repository, cấu trúc thư mục và luồng gọi cho một ứng dụng nhỏ.
Phân tích và giảm thiểu rủi ro từ dữ liệu đầu vào
Rà soát mã xử lý input để phát hiện chèn lệnh, path traversal và đề xuất chỉnh sửa an toàn theo bối cảnh thực tế.
Thiết kế cơ chế retry/backoff cho gọi mạng thất bại tạm thời
Tạo chiến lược retry an toàn, có backoff và giới hạn thử lại cho tác vụ mạng; trả về code hoặc giả mã rõ ràng.
Chẩn đoán và sửa lỗi xác thực, phân quyền backend
Phân tích middleware hay logic quyền truy cập, đưa bản sửa và test xác nhận cho lỗi chặn sai hoặc lọt quyền.
