Các công cụ Vibe Code

Context Stuffing: Cho Agent "Ăn" Dữ Liệu

Replit Agent (và các LLM hiện đại) không biết những gì bạn không cho nó xem. Mặc dù nó có khả năng quét file, nhưng để đạt độ chính xác cao nhất, bạn cần chỉ định rõ ràng tài nguyên nào liên quan.

Đây là lúc kỹ thuật Explicit Context (@ Mention) tỏa sáng.

Sức mạnh của ký tự @

Trong khung chat Replit, khi gõ @, bạn có thể chọn:

• Files: @utils/supabase.ts, @components/Button.tsx.
• Docs: Update docs (nếu có).

Khi bạn nói: "Hãy sửa lỗi ở trang Login", Agent phải đoán trang Login ở đâu. Nhưng khi bạn nói: "Hãy sửa lỗi ở @app/login/page.tsx dựa trên logic validation trong @lib/utils.ts", Agent có đủ 100% dữ liệu để thao tác chính xác.

Khi nào cần dùng @?

1. Refactoring: Khi sửa code cũ, BẮT BUỘC phải @ file cần sửa.
2. Consistency: Khi tạo file mới, hãy @ file mẫu (Reference) để nó bắt chước style code.
   • Prompt: "Hãy tạo component Footer có style tương tự như @Header.tsx."
3. Fix Bug: Khi có lỗi, hãy @ file log lỗi (nếu có) hoặc @ file gây ra lỗi.

Cung cấp "Tri thức bên ngoài" (External Knowledge)

Đôi khi Agent không biết về thư viện mới nhất hoặc design system riêng của bạn.

1. File SYSTEM_DESIGN.md (hoặc RULES.md):

   • Tạo một file .md trong root folder.
   • Ghi các quy tắc: "Màu chủ đạo: #00A651", "Font: Inter", "Luôn dùng arrow function".
   • Trong prompt, luôn @ file này: "Dựa trên quy tắc trong @RULES.md, hãy..."

2. Paste Documents:

   • Nếu dùng một thư viện lạ, copy đoạn docs cách sử dụng basic của thư viện đó paste thẳng vào chat. "Đây là cách dùng thư viện X: [Paste Content]. Hãy implement nó vào..."

Tránh "Context Poisoning" (Ngộ độc bối cảnh)

Đừng @ toàn bộ folder node_modules. Đừng @ những file không liên quan. Việc nhồi quá nhiều thông tin rác sẽ khiến Agent bị nhiễu (distracted) và tăng chi phí token/thời gian xử lý.

🎯 Mục tiêu: Cung cấp Vừa Đủ (Just Enough) context. Không thừa, không thiếu. Đó là nghệ thuật của người điều phối.