Astro 7.3

Is Minifying CSS Necessary? (2023)

Trong bối cảnh tối ưu hóa website, việc minifying CSS từng được coi là bắt buộc. …

Beyond the Luminance Ramp: A Shape-Aware ASCII Renderer in Three.js

Bài viết mô tả việc tái tạo biểu tượng Codrops dưới dạng một vật rắn có thể kéo trong môi trường Three.js. Vật thể được hiển thị dưới dạng ký tự ASCII, và quá trình render được thực hiện hoàn toàn trên GPU bằng cách mỗi ô ký tự tìm kiếm trong bảng 95 ký tự in được. Phương pháp này cho phép thay đổi hình dạng và vị trí của đối tượng trong thời gian thực mà vẫn giữ được độ phân giải cao của ảnh ASCII. Kết quả là một

Bài viết này giúp lập trình viên khám phá cách tạo bộ ASCII renderer nhận dạng dạng hình trong Three.js với hiệu suất GPU ấn tượ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 2017, và trang đó vẫn không bị thay đổi tới nay. Ông chọn viết bằng HTML thuần, CSS và vanilla JavaScript, không dùng bất kỳ framework hoặc công cụ build nào, nhằm tối ưu độ đơn giản và khả năng duy trì lâu dài. Sau hơn ba năm, trang web vẫn hoạt động ổn định mà không cần cập nhật, cho thấy việc tránh phụ thuộc vào thư viện bên thứ ba giảm thiểu rủi ro lỗi và công việc bảo trì. Điều này cho thấy khi mục tiêu là một trang web tĩnh thay đổi hiếm, việc hand‑code giúp kiểm soát hoàn toàn mã nguồn, giảm kích thước tải và dễ dàng di chuyển giữa các host. Bài viết nhắc nhở lập trình viên cân nhắc trade‑off giữa tốc độ phát triển bằng framework và lợi ích lâu dài của mã nguồn hand‑written, đặc biệt cho các dự án có thời gian sống dài.

Bài viết này giúp bạn hiểu được giá trị của việc viết website thủ công trong kỷ nguyên framework hiện đại.

How we saved 100 terabytes of memory by optimizing 1.1.1.1’s DNS cache

Cloudflare’s 1.1.1.1 công khai DNS resolver duy trì một bộ nhớ cache lớn để xử lý hàng tỷ truy vấn mỗi ngày. Đội ngũ đã thực hiện năm tối ưu hoá cấp Rust trong bố cục mục cache: tái cấu trúc struct, sử dụng kiểu số nguyên gọn gàng, loại bỏ padding, áp dụng arena allocation và lưu trữ trước giá trị băm, giảm kích thước mỗi mục xuống 56 %. Khi mở rộng ra toàn bộ hạ tầng toàn cầu, việc này giải phóng khoảng 100 TB RAM, tạo thêm dung lượng cho các đợt lưu lượng cao và giảm chi phí vận hành. Bài học là việc kiểm soát bố cục dữ liệu và khai thác khả năng kiểm soát bộ nhớ của Rust có thể tiết kiệm tài nguyên lớn ngay cả ở các dịch vụ quy mô lớn. Đọc bài gốc sẽ cung cấp các con số cụ thể và hướng dẫn chi tiết từng bước để áp dụng các tối ưu hoá tương tự vào các cache khác.

Bài viết tiết lộ những tối ưu hóa cấp độ Rust giúp tiết kiệm 100 terabyte bộ nhớ cho cache DNS của Cloudflare.

Your React app doesn’t need all that JavaScript

React app thường tải một lượng JavaScript không cần thiết, gây ra hiệu năng kém. Nguyên nhân là do nhiều tính năng hoàn toàn có thể thực hiện bằng native browser features như :has() selector, Popover API, scroll-snap carousels và CSS animations. Hệ quả là app trở nên chậm, tốn tài nguyên và khó bảo trì. Đáng học ở đây là việc tối ưu bằng cách giảm phụ thuộc vào JavaScript, tận dụng các API trình duyệt hiện có. Phân tích cho thấy việc thay thế một số components React bằng CSS và DOM APIs giúp giảm tới 40% bundle size.

Bài viết này giúp bạn đơn giản hóa ứng dụng React bằng cách tận dụng các tính năng trình duyệt nguyên bản, giảm thiểu sự phụ thuộc vào JavaScript.

Cypress 16: faster tests, starting with HTTP/2 support

Cypress 16 tập trung giải quyết mọi nguyên nhân làm chậm test suite với HTTP/2 support giúp giảm đáng kể thời gian load tài nguyên. Zero-delay typing và faster visibility checks cải thiện tốc độ tương tác với elements, trong khi retrying cookie commands tránh lỗi do vấn đề mạng. Tự động memory management ngăn chặn rò rỉ bộ nhớ qua các test case dài. Phiên bản này đáng học vì tăng hiệu suất test lên đến 30% so với bản trước, đặc biệt hữu ích cho dự án sử dụng nhiều API call và test UI phức tạp.

Cypress 16 giúp tăng tốc độ kiểm thử đáng kể với hỗ trợ HTTP/2 và nhiều cải tiến tối ưu hiệu suất khác.

Why I don't recommend Tailwind CSS

Tailwind CSS là framework CSS phổ biến giúp chuẩn hóa khoảng cách, màu sắc, kiểu chữ mà không yêu cầu kiến thức thiết kế đồ họa. Tuy nhiên, tác giả không khuyến nghị sử dụng nó do những hạn chế trong khả năng tùy biến, hiệu suất và cách tiếp cận "utility-first" có thể gây khó khăn cho việc bảo trì.

Lập trình viên nên đọc bài này để hiểu cách Tailwind CSS có thể khiến dự án trở nên rắc rối hơn khi không có kiến thức về thiết kế UI, dẫn đến thời gian phát triển lâu hơn và chất lượng thiết kế kém hơn so với cách sử dụng CSS truyền thống hoặc các framework khác.

Almost nobody pays attention to web standards anymore

Một nghiên cứu của nhà phát triển Théo Ducreux trên 5.000 tên miền phổ biến nhất cho thấy 87,2% vi phạm tiêu chuẩn HTML/CSS, chỉ 12,8% hợp lệ hoàn toàn và 2,6% không có lỗi hay cảnh báo. Hơn 1/3 không đạt kiểm tra khả năng truy cập, với 20,4% thiếu alt text và 41,6% thiếu ARIA labels; lỗi lồng thẻ chiếm 59% do các framework front-end sinh ra markup lỗi thời điểm build. Các trình duyệt cho phép phục hồi lỗi đã dung túng mã kém chất lượng, gây hỏng hóc cho trình đọc màn hình, trợ lý AI hay công cụ dịch.

Lập trình viên nên đọc bài này để hiểu rõ cách các tiêu chuẩn web hiện nay bị vi phạm rộng rãi, từ đó nâng cao kiến thức về cách viết mã chính xác, đảm bảo tính khả dụng và tương thích với các công cụ tương lai như AI và trợ lý giọng nói.