Helix: The internal tool powering our Shopify app's native migration

Shopify · 2026 · 4. Điều chỉnh · Độ khó: Trung bình — bài gốc

Bối cảnh

• Shopify chuyển app mobile từ React Native về native (Swift, Kotlin); app Shop đã làm xong trong 12 tuần. Lần này là app Shopify, app lớn nhất, hơn 300 màn hình (2026).
• Dùng LLM để viết lại vì model đã đủ mạnh, nhưng theo Shopify kết quả nhất quán, chất lượng, bảo trì được thì không có sẵn; cần công cụ và rào chắn.

Thay đổi chính

• Không kỳ vọng lần đầu đúng. Thay vì gom hết thông tin thành đặc tả, làm cả màn hình một lần rồi trao một diff khổng lồ, Helix dựng một vòng lặp mà kết quả chưa đạt thì không được đi tiếp.
• Checkpoint nhỏ: engineer chỉ vào một màn hình; Helix đọc code React Native và đề xuất chuỗi checkpoint tăng dần (khung màn hình → một phần nhỏ → …), mỗi cái mô tả vài chữ để người duyệt thứ tự trong vài phút. Checkpoint nhỏ vừa ngữ cảnh nên agent đọc thẳng code gốc: code tham chiếu chính là đặc tả. Một subagent sinh test case (kiểu integration, từ góc người dùng) cho từng checkpoint.
• Bốn cổng theo thứ tự, không được bỏ qua dù agent cho là đủ tốt:
  1. Hành vi: CLI nội bộ phơi cùng trạng thái và hành động như app; test hành vi chạy không cần simulator nên lặp hàng chục lần rất nhanh.
  2. UI: orchestrator (GPT) chụp màn hình bản mới và bản tham chiếu ở cùng trạng thái, model Gemini đóng vai reviewer thiết kế khó tính, liệt kê mọi khác biệt kèm mức độ và vị trí; khác biệt sửa được bằng code mặc định là blocker; ảnh không cùng trạng thái thì đánh dấu INVALID để chụp lại. Phạm vi so sánh giới hạn theo phần checkpoint đã làm. Lý do: tương đương UI gần như không đặc tả được, so pixel không dùng được giữa hai framework.
  3. Review đối kháng: hai agent review độc lập, cách ly ngữ cảnh, đối chiếu với tài liệu kiến trúc đã viết kỹ; mọi phát hiện phải sửa, chạy lại test (và cổng UI nếu giao diện đổi), lặp tới khi cả hai duyệt.
  4. Engineer duyệt: phản hồi vừa được sửa ngay vừa được ghi vào bộ nhớ để áp cho các checkpoint sau.
• Tự chủ tăng dần: checkpoint đầu cần người nhiều; khi phản hồi tích luỹ thì có thể chạy nhiều checkpoint liền hay bỏ duyệt (chạy qua đêm), nhiều màn hình song song; cổng không lỏng đi khi không có người. Mỗi checkpoint là một commit kèm bằng chứng (review UI lưu lại, test qua, phán quyết reviewer).

Vì sao

• Theo Shopify: công cụ "một phát ăn ngay" dồn hết việc review vào cuối, trên một diff lớn trải qua hành vi, giao diện, hai nền tảng và kiến trúc; Helix đưa phản hồi về sớm nhất có thể. Bài học họ rút ra: tối ưu cho hội tụ đáng tin chứ không cho lần thử đầu hoàn hảo; vòng lặp này không riêng cho migration (tính năng mới dùng thiết kế làm tham chiếu, refactor thì bỏ cổng UI).

Bài học cho SWE

• Bản cũ đang chạy là đặc tả tốt nhất cho một lần viết lại; cần cách so sánh tự động với nó ở từng lát nhỏ.
• Với agent, review là cổng chứ không là lời khuyên: điều kiện qua phải kiểm được, và agent không được tự miễn.
• Tài liệu kiến trúc viết rõ là thứ làm cho review tự động có chuẩn để bắt lỗi.

Liên quan

• Cloudflare 2026 · Allegro 2026 · DoorDash 2026 · Meta 2020
• Coding agent trong engineering (migrate, viết lại, chạy song song, quyền hạn) · Kiến trúc frontend