Ba repo cho coding agent: tạo, kiểm chứng và đo lường
Ba repo GitHub cho Claude Code và Codex: img2threejs dựng model Three.js từ ảnh, Reticle kiểm app thật bằng verdict, Caliper đo skill bằng ablation.
✓ Đã duyệt độc lập · cập nhật 01/11/2026 · 11 min
1. Agent dựng trang trong vài giây, nhưng repo nào đổi được kết quả?
Video mở đầu bằng một nhận xét của người dẫn kênh Thetips4you (video đăng ngày 29/10/2026): một agent có thể lắp ráp một trang web bóng bẩy (a polished page) chỉ trong vài giây. Rồi có rất nhiều repo trên GitHub hứa sẽ làm cho setup đó mạnh hơn. Câu hỏi anh đặt ra là repo nào là tốt nhất, và repo nào thay đổi được kết quả thật sự.

localhost:3000, có nút "Start building" và một khung "live product preview" với một khối lục giác 3D.Anh giới thiệu ba repo sẽ xem trong video (đăng ngày 29/10/2026). Repo thứ nhất biến một ảnh thành một cảnh sản phẩm chỉnh sửa được (an editable product scene). Repo thứ hai bắt được những ca như một trang checkout trông đã xong xuôi trong khi phần thanh toán lại lỗi. Repo thứ ba đo xem một skill thêm vào có cải thiện kết quả hay không.
Ba repo đó là img2threejs, Reticle và Caliper. Anh nói sẽ cho xem workflow của cả ba, vì sao chúng quan trọng, và chúng có thể giúp năng suất chung của bạn khi làm việc với AI ra sao (video đăng ngày 29/10/2026).
2. Ba repo, ba việc: create, verify, measure
Theo anh (video đăng ngày 29/10/2026), một setup coding mạnh hơn phải có ba phần. Thứ nhất là tạo ra artifact (create). Thứ hai là kiểm tra xem artifact đó thực sự làm gì (inspect). Thứ ba là đo xem công cụ đó có thay đổi kết quả hay không (measure).

Anh nói ba repo này bổ trợ cho nhau, có thể nối với nhau thành một chuỗi (video đăng ngày 29/10/2026). Và theo anh, giữ cho lộ trình đó nhìn thấy được sẽ ngăn bạn cài công cụ chỉ vì chúng đang trending.
3. Khi nào dùng repo nào
Anh chia việc dùng ba repo theo tình huống (video đăng ngày 29/10/2026):
- img2threejs: khi bạn cần chỉnh sửa, ví dụ một trang web có nội dung 3D (video đăng ngày 29/10/2026).
- Reticle: khi một screenshot không chứng minh được một user flow, cái luồng end-to-end mà AI không kiểm tra hết (video đăng ngày 29/10/2026).
- Caliper: khi bạn cần biết một skill có giúp ích trên một task lặp lại được của agent hay không (video đăng ngày 29/10/2026).
Cách anh đi qua từng repo trong video đăng ngày 29/10/2026: mỗi repo một task thật và một phép kiểm cụ thể.
4. img2threejs: từ một ảnh phẳng tới code Three.js chỉnh được
Repo đầu tiên là img2threejs. Anh đưa ra một tình huống (video đăng ngày 29/10/2026): bạn có một ảnh tham chiếu của một chiếc tai nghe, một chiếc xe, hay một sản phẩm nhỏ. Đó là một ảnh phẳng, trông thuyết phục, nhưng bạn không xem được nó ở ba chiều, cũng không đổi màu được, nên không làm cho nó phản hồi lại người xem trên trang của bạn được.
Cách làm anh mô tả (video đăng ngày 29/10/2026): dùng img2threejs, nhờ Claude dựng lại vật thể đó bằng code Three.js procedural. Theo anh, kết quả là một model chỉnh sửa được, tạo từ geometry và material, chứ không phải một ảnh đặc (opaque image). Nó trở thành một phần của interface, sẵn sàng cho tương tác, và anh nói bạn không cần thêm animation nào nữa.
Anh mở repo trên GitHub và nói repo có khoảng 19,7 nghìn sao, là repo số một của ngày, và của tuần (theo lời anh trong video đăng ngày 29/10/2026). Trên màn hình, bảng huy hiệu TrendShift ghi cụ thể hơn: ở mục Python là "#1 Repository Of The Day" và "#4 Repository Of The Week"; ở mục All languages là "#4 Repository Of The Day" và "#10 Repository Of The Week".

5. Live demo người máy và cách cài base skill
Theo anh (video đăng ngày 29/10/2026), repo này rất đơn giản và có nhiều live demo khác nhau; bạn xem các demo đó để thấy nó tạo ra nhân vật ba chiều hay bất cứ thứ gì bạn yêu cầu ra sao. Anh mở một demo hình người máy (man robot) và nói bạn có thể xoay nó; anh nói đó là một hình ba chiều trọn vẹn, có thể đặt vào website của bạn hay dùng cho những việc khác.

Theo anh (video đăng ngày 29/10/2026), phần dễ nhất là cài đặt: chỉ cần cài base skill img2threejs bản latest. Cài xong, nó được tích hợp vào Claude Code, Codex, OpenCode, hay bất kỳ harness coding AI nào bạn dùng. Rồi bạn chỉ cần nói đơn giản, đại ý: dùng ảnh này và chuyển nó thành một diagram ba chiều bằng img2threejs.
Phần Quick start của README trong video đăng ngày 29/10/2026 ghi cần Node.js ≥ 18, Git và Python ≥ 3.10, cùng một trong Claude Code, Codex, OpenCode hoặc Hermes. Bước "1. Install the base skill" trên màn hình:
npx --yes img2threejs@latest install # links the skill into every agent it finds npx --yes img2threejs@latest doctor # one line per agent: "managed" means installed
6. Không phải một ảnh vào, một model hoàn hảo ra
Anh nói phiên bản hấp dẫn của câu chuyện này là: một ảnh vào, một model hoàn hảo ra. Nhưng theo anh (video đăng ngày 29/10/2026), chính repo mô tả một quy trình reconstruction có quality gate (quality-gated). Bạn so object được tạo ra với ảnh tham chiếu, xác định chỗ lệch (mismatch), rồi có thể nhờ agent sửa lại lần nữa. Anh nhắc lại là có nhiều ví dụ, như các live demo anh vừa cho xem.
Phần "How it works" của README trong video đăng ngày 29/10/2026 mô tả một pipeline dựng theo từng giai đoạn: ảnh tham chiếu thành một spec, rồi sinh và review bằng vision từng lượt build một (blockout → structural → form → material → surface → lighting → interaction → optimization), tự sửa cho tới khi mọi đặc điểm nhận diện vượt ngưỡng; các script Python lo phần validation và gating.
Theo anh (video đăng ngày 29/10/2026), hãy dùng công cụ này khi một web graphic chỉnh sửa được là thứ quan trọng, hoặc khi bạn chấp nhận phải lặp nhiều vòng với hình dạng phức tạp, ánh sáng và chi tiết. Anh nói nó sẽ thật sự giúp ích trong các use case hằng ngày nếu bạn build nhiều website và object ba chiều.
7. Reticle: điểm mù mà screenshot không thấy
Tiếp theo là Reticle, theo anh là repo xử lý một điểm mù khác (video đăng ngày 29/10/2026). Giả sử bạn chụp một screenshot, nó cho thấy một trang checkout đẹp của app. Nhưng nó không cho bạn biết request thanh toán có trả về lỗi hay không, trạng thái có thay đổi hay không, hay một flow chạy được hôm qua giờ có hỏng không.

500 im lặng dưới một trang trông hoàn hảo, một flow từng chạy giờ hỏng, mock data ở chỗ lẽ ra là API thật. Dòng tiếp theo: "Reticle is a proofreader for AI-written code".Theo anh (video đăng ngày 29/10/2026), một agent có thể chụp screenshot của một trang có payment gateway, nhưng không biết chính xác chuyện gì đang xảy ra ở backend. Reticle giúp ở chỗ nó nối coding agent với app đang chạy local, và cho agent quan sát chuyện gì diễn ra trong lúc nó thao tác.
Anh gọi đây là chuyển dịch then chốt (video đăng ngày 29/10/2026): từ "trang này có vẻ đúng" sang "một hệ quả đã khai báo (a declared consequence) thực sự đã xảy ra". Theo anh, điều đó quan trọng nhất với các workflow có nhiều bước và có state ẩn.
8. Verdict rõ ràng: yes, no, unknown
Theo anh (video đăng ngày 29/10/2026), bạn muốn có một output trọn vẹn và gắn với bằng chứng. Trong Reticle, "yes" là hiệu ứng mong đợi đã được thấy; "no" là phép kiểm thất bại; còn "unknown" là bằng chứng hiện có chưa đủ để kết luận. Sự không chắc chắn nên được giữ cho nhìn thấy, thay vì lặng lẽ bị coi như thành công. Anh nói Reticle có định nghĩa rõ ràng cho cách nhìn các phép kiểm và lúc nào thì nói là đã pass.


9. Repo Reticle và cách cài
Anh mở repo Reticle và nói nó chưa nổi lắm: chỉ khoảng 1,3 nghìn sao (theo lời anh trong video đăng ngày 29/10/2026). Ý chính anh nhắc lại: agent của bạn nói "done", còn Reticle tìm xem điều đó có thật không.
Theo anh (video đăng ngày 29/10/2026), bạn dùng Reticle để điều khiển app thật đang chạy, xem chuyện gì đã xảy ra, rồi nhận verdict pass, fail hoặc không kết luận được. Anh nói đây là một vấn đề rõ ràng mà bạn muốn giải, và nó chắc chắn sẽ giúp nếu bạn muốn thử một flow trọn vẹn từng bước một, rồi nhận thông tin rõ ràng là test có pass hay không.
Phần "What Reticle does" của README trong video đăng ngày 29/10/2026 ghi: Reticle đặt một SDK nhỏ, chỉ dùng khi dev, vào trong app; coding agent nhận các tool để look, act, observe và assert qua đó, và mỗi phép kiểm kết thúc bằng một verdict có bằng chứng kèm theo.
Về cài đặt, anh nói rất đơn giản (video đăng ngày 29/10/2026): chạy script cài đặt, rồi bắt đầu dùng với Claude, hoặc với Cursor, để test app của bạn. README trong video ghi bước thêm skill (cho Claude Code, Cursor, Codex, Copilot, Gemini và các agent khác), để dạy agent nối app và chứng minh một flow:
npx skills add reticlehq/reticle --skill reticle
Cũng trong README đó (video đăng ngày 29/10/2026), với Claude Code thì plugin làm cả hai bước: /plugin marketplace add reticlehq/reticle, rồi /plugin install reticle@reticlehq, sau đó gõ /reload-plugins mà không cần khởi động lại. Nếu không muốn pipe một script vào shell, README ghi cách khác:
npm install -g @reticlehq/server reticle setup mcp

10. Caliper: skill có thật sự giúp agent không?
Repo cuối là Caliper. Anh đặt vấn đề (video đăng ngày 29/10/2026): thư mục skills ngày càng lớn, ta cài quá nhiều thứ, nối rất nhiều skill vào AI. Nó có thật sự giúp không? Theo anh, ta nên hỏi: chỉ dẫn này có thật sự cải thiện agent hay không.
Theo anh (video đăng ngày 29/10/2026), một demo thành công là chưa đủ. Kết quả đó có thể vẫn xảy ra kể cả khi không có skill; skill có thể thất bại; hoặc một chỉ dẫn khác đang tranh sự chú ý với nó.
Anh mô tả cách Caliper làm (video đăng ngày 29/10/2026): nó chạy các task agent thật, có và không có một skill, một rule hay một MCP server. Task giữ nguyên, setup thay đổi. Phép so sánh này gọi là ablation. Nó biến cái cảm giác mơ hồ rằng một skill có ích thành một phép test của riêng bạn, lặp lại được. Anh nói đây giống một kịch bản testing để xem skill hay MCP có thật sự giúp trong setup AI của bạn không.

11. Cài Caliper trong agent hoặc terminal
Đây là repo thứ ba, Caliper, để xem skill của agent có thật sự chạy không; anh nói nó sẽ rất hữu ích (video đăng ngày 29/10/2026). Về cách dùng, anh nói có hướng dẫn: chạy npx bản latest rồi thêm skill Caliper, hoặc dùng qua terminal bằng pip install (README trên màn hình ghi pipx install caliper-eval); cài xong thì dùng với Codex, Claude và các agent khác, và xem được chi tiết đầy đủ của skill.
Phần Quick start trong README trên màn hình (video đăng ngày 29/10/2026) có hai cột. Cột "In your agent":
npx skills@latest add edonadei/caliper # then, in your agent: /grill-skill ./inbox-triage/SKILL.md
README ghi grill-skill sẽ phỏng vấn bạn, viết spec, rồi chạy spec đó có và không có skill của bạn (video đăng ngày 29/10/2026). Cột "In your terminal":
pipx install caliper-eval SPEC=inbox-triage/inbox-triage.eval.yaml caliper run $SPEC --ablate inbox-triage caliper run $SPEC caliper compare \ .caliper/results/inbox-triage/RUN_ID.json \ inbox-triage

--ablate chạy lại không có skill; điểm như nhau thì skill không đáng chỗ trong context), "Honest numbers", "Four agents" (Claude Code, Codex, Pi, Hermes), rồi Quick start và phần "Write a spec" với file .eval.yaml.Phía trên Quick start, README trong video đăng ngày 29/10/2026 có một bảng ví dụ với skill inbox-triage: cùng các task, có và không có skill, success từ 80% lên 100%, token từ 612K xuống 431K, thời gian từ 4m 22s xuống 3m 8s; chú thích dưới bảng ghi agent trần đã pass 80%, và skill đưa lên 100% với ít hơn 30% token và ít hơn 28% thời gian.
12. Scorecard tách ba câu hỏi, và skill hàng xóm
Theo anh (video đăng ngày 29/10/2026), một điểm của Caliper là có một scorecard tốt, tách riêng ba câu hỏi:
- Agent có chọn đúng skill mong muốn không? (video đăng ngày 29/10/2026)
- Task có pass không? (video đăng ngày 29/10/2026)
- Chỉ dẫn thêm vào tốn bao nhiêu token hay thời gian? (video đăng ngày 29/10/2026)
Anh nói activation không phải là thành công (video đăng ngày 29/10/2026): một skill có thể load đúng mà vẫn làm người dùng thất bại. Caliper còn cho bạn khai báo các skill hàng xóm (neighbouring skills) có thể cạnh tranh cùng một prompt. Theo anh, hãy dùng nó trước khi cài thêm một lớp chỉ dẫn nữa.

caliper compare cho skill landing-page, k=3 (demo trong video đăng ngày 29/10/2026): Builds the pricing page 33.3% → 100.0%, Adds a contact form 66.7% → 100.0%, Fixes the mobile menu 66.7% → 66.7%; Overall 55.6% → 88.9% (+33.3%), Tokens 246K → 298K (+21%), Wall 1m 38s → 1m 52s (+14%).Anh nói tới việc giữ, sửa lại hay gỡ một skill tuỳ theo kết quả và chi phí bạn chấp nhận được (video đăng ngày 29/10/2026). Nếu setup trở nên quá nặng, theo anh, bạn nên gỡ bớt những skill không thật sự cần.
13. Ba loại bằng chứng: chọn một khoảng trống, chứng minh một cải thiện
Anh tóm lại (video đăng ngày 29/10/2026): ba repo, ba loại bằng chứng.
- img2threejs nên tạo ra một object chỉnh sửa được: bạn xoay (orbit) được, đổi màu được, xem được trong code (video đăng ngày 29/10/2026).
- Reticle nên cho thấy user journey thật và state đã thay đổi, cùng cách bạn đánh giá nó (video đăng ngày 29/10/2026).
- Caliper nên so cùng các task có và không có một skill (video đăng ngày 29/10/2026).

Lời khuyên cuối của anh (video đăng ngày 29/10/2026): chọn ra khoảng trống trong workflow của bạn hôm nay, chạy một task tiêu biểu, ghi lại baseline, rồi lặp lại với repo đã cài. Chỉ giữ lại khi kết quả cải thiện với một chi phí bạn chấp nhận được.
Theo anh (video đăng ngày 29/10/2026), đừng gom thật nhiều skill, thật nhiều plugin và MCP chỉ cho có; làm như trên thì setup coding của bạn mới xứng đáng được nâng cấp. Anh cảm ơn mọi người đã xem.
Nguồn và liên kết 7 nguồn
- Tên gốc: Insane GitHub Repos That 10x Your Codex And Claude Code Setup
- Sự kiện: YouTube
- Video gốc: https://www.youtube.com/watch?v=iSImMJD8qXY youtube.com
- Kênh YouTube Thetips4you (Thetips4you): youtube.com/channel/UCoOq-DtESvayx5yJE5H6-qQ youtube.com
- Repo img2threejs: README mô tả công cụ dựng lại vật thể trong ảnh tham chiếu thành model Three.js procedural chỉ bằng code, có quality gate, live demo và Quick start (đọc ngày 01/11/2026): github.com/img2threejs/img2threejs github.com
- Repo Reticle: README mô tả việc chạy app thật và trả verdict pass, fail hoặc cannot tell kèm
file:line; phần cài đặt hiện đã khác bản trong video (đọc ngày 01/11/2026): github.com/reticlehq/reticle github.com - Repo Caliper: README mô tả việc chạy agent có và không có skill, activation scoreboard, neighbourhoods và ablation (đọc ngày 01/11/2026): github.com/edonadei/caliper github.com