Stop Building AI Slop: Build High-End Web Apps with AI

Frontend Dependency Injection: From Context API to Composition Root

Bài viết bắt đầu bằng việc mô tả cách nhiều dự án React hiện nay sử dụng Context API để thực hiện dependency injection, nhưng nhanh chóng chỉ ra hạn chế của cách này như việc lồng.provider sâu dẫn tới re‑render không mong muốn và khó kiểm tra đơn vị. Sau đó, tác giả giới thiệu mô hình Composition Root – nơi tất cả các phụ thuộc được tạo và kết nối ở một điểm duy nhất, thường là tệp index.js hoặc App.tsx, giúp làm rõ đồ thị phụ thuộc và giảm bớt việc truyền props qua nhiều lớp component. Khi áp dụng Composition Root, các dịch vụ có thể được thay thế bằng mocks hoặc triển khai khác mà không cần thay đổi mã component, từ đó cải thiện độ bao phủ test đơn vị lên khoảng 20‑30% trong các trường hợp thử nghiệm thực tế. Bài cũng nhấn mạnh việc kết hợp với TypeScript và các container DI nhẹ như tsyringe hoặc inversifyJS để quản lý vòng đời (singleton, transient) một cách tự động. Kết luận là, cho dự án lớn hoặc dự kiến mở rộng, chuyển từ Context API sang Composition Root không chỉ giảm lỗi thời gian chạy mà còn làm cho kiến trúc frontend dễ duy trì và mở rộng hơn.

Bài viết này giúp lập trình viên hiểu rõ cách triển khai Dependency Injection trong frontend từ Context API đến Composition Root để xây dựng ứng dụng dễ bảo trì và mở rộng.

I still like writing websites by hand

Tác giả từng hand‑code một trang web cho Alex vào năm 2020, sau khi họ quen nhau từ năm …

I Added a CDN Cache to My Site and It Got Slower. Here's the Math I Should Have Done First.

Tác giả đã thêm CDN cache vào trang static site nhưng hiệu suất lại giảm đáng kể với 38 trang bị đánh dấu là chậm. Nguyên nhân kỹ thuật do việc cấu hình TTL (Time To Live) quá thấp khiến CDN phải liên tục kiểm tra origin server, gây ra 2 RTT (Round Trip Time) cho mỗi request thay vì chỉ 1 RTT như không dùng CDN. Hệ quả là thời gian tải trang tăng từ 200ms lên 350ms, làm trải nghiệm người dùng xấu đi đáng kể. Bài viết nhấn mạnh việc tính toán trước khi triển khai CDN và quan trọng hơn là thiết kế chiến lược caching phù hợp với đặc thù traffic website.

Bài viết này giúp bạn hiểu rõ những sai lầm toán học khi triển khai CDN để tránh làm giảm hiệu suất trang web.

The Pulse: We need to talk about migrations with AI

Asana đã quyết định di chuyển khỏi framework kiểm thử Enzyme và hoàn thành việc này trong vòng hai tuần nhờ sự hỗ trợ của AI. Nếu không có AI, nhóm phát triển cho rằng công việc này sẽ bị hoãn lại không xác định. Cùng với Asana, cả Airbnb và Uber cũng báo cáo về những trải nghiệm tương tự khi áp dụng AI vào các nhiệm vụ di chuyển hệ thống. Kết quả là các công ty này tiết kiệm được thời gian đáng kể và tránh được những gián đoạn trong quy trình phát triển. Điều này cho thấy AI có thể trở thành công cụ hiệu quả để tăng tốc độ và giảm rủi ro khi thực hiện các migration framework phức tạp.

Bài viết này cho thấy cách AI giúp thực hiện các dự án di chuyển hệ thống phức tạp một cách nhanh chóng và hiệu quả, giúp lập trình viên tiết kiệm thời gian và tránh trì hoãn công việc quan trọng.

Agentic Code Quality

Bối cảnh: Sự tăng trưởng của các AI agent như GitHub Copilot, Amazon CodeWhisperer đang …

The asteroid currently hitting frontend web development

Nhiều giáo viên nổi tiếng trong lĩnh vực frontend web development như Axel Rauschmayer …

The Future of CSS: Target Multiple Classes with the Class Prefix Selector

CSS sắp bổ sung bộ chọn Class Prefix Selector (.prefix-*) cho phép nhắm mục tiêu tất cả các class có tiền tố phân cách bằng dấu gạch ngang (như .btn-primary, .btn-secondary) mà không cần liệt kê riêng lẻ hay thêm class cơ sở. Đề xuất này do Lea Verou đưa ra năm 2024, vừa được nhóm CSS Working Group thông qua tháng 8/2026 nhưng hiện chưa có trình duyệt nào hỗ trợ, dự kiến sẽ mất nhiều năm mới triển khai thực tế.

Lập trình viên nên đọc bài này để hiểu cách tương lai của CSS sẽ giúp tối ưu hóa quản lý các lớp CSS liên quan với các tiền tố giống nhau, giảm thiểu việc viết nhiều selector rườm rà và làm cho mã nguồn trở nên sạch đẹp hơn trong tương lai sớm.

Is AI going to steal my job as a design engineer?

Thiết kế sản phẩm đang trải qua sự can thiệp của AI qua các công cụ agent tự động hoá các tác vụ lặp lại. Những mô hình sinh hình và hệ thống agent có thể tạo ra bản phác thảo, bố cục và các thành phần UI dựa trên mô tả tự nhiên, giảm công việc scaffolding. Vì vậy, các kỹ sư thiết kế sẽ dành ít thời gian hơn để vẽ khung, nhưng cần tập trung hơn vào việc định hướng thẩm mỹ, kiểm soát độ phức tạp và hoàn thiện chi tiết visual. Điều đáng học là khi AI xử lý phần “scaffold”, giá trị thực của nhà thiết kế nằm ở vị giác sản phẩm, sự tự chế và khả năng tạo ra những giao diện mịn màng, điều này không thể thay thế bằng thuật toán hiện tại. Do đó, đọc bài gốc giúp lập trình viên hiểu rõ vai trò mới của AI trong quy trình thiết kế và cách duy trì lợi thế cạnh tranh qua việc phát triển kỹ năng thẩm mỹ và quyết định.

Bài viết giúp bạn hiểu vị thế thiết kế kỹ thuật của mình trong kỷ nguyên AI, biết được đâu là giá trị mà AI không thể thay thế.