Palindrome Checker : Frontend Coding Exercises

TanStack Charts 1.0

TanStack Charts 1.0 là thư viện charting hiện đại, cung cấp giải pháp thay thế cho các …

Random Color Palette : Frontend Coding Exercises

Bài tập hướng dẫn xây dựng generator color palette tạo 5 màu ngẫu nhiên khi nhấn nút hoặc phím spacebar. Các màu được hiển thị dưới dạng hex value và người dùng có thể copy giá trị hex chỉ bằng một click. Đây là bài tập thực hành kỹ năng frontend cơ bản như xử lý sự kiện, DOM manipulation và random number generation. Bài viết phù hợp cho người mới học JavaScript muốn làm quen với các khái niệm về DOM event handling và cách thao tác với API clipboard.

Bài viết giúp lập trình viên thực hành kỹ năng tạo màu ngẫu nhiên và sao chép giá trị hex một cách hiệu quả.

Dark Mode Toggle : Frontend Coding Exercises

Bài hướng dẫn thực hành thêm chế độ sáng/tối cho trang web với nút chuyển đổi. Sử dụng CSS variables để quản lý màu sắc và localStorage để lưu lựa chọn của người dùng. Code ví dụ áp dụng JavaScript cơ bản để xử lý sự kiện click và cập nhật DOM. Đây là bài tập hữu ích cho người mới học về CSS customization và client-side storage.

Bài hướng dẫn này cung cấp bài thực hành thiết kế giao diện tối/t sáng với khả năng lưu trạng thái lựa chọn của người dùng.

Optimizing objects with null prototypes

V8 engine gặp vấn đề khi đối tượng với __proto__: null bị mắc kẹt ở dictionary mode. Nguyên nhân kỹ thuật nằm ở cách V8 xử lý prototype chain khi prototype được đặt thành null. Hệ quả là hiệu năng giảm đáng kể, như test case cho thấy WebStreams throughput chỉ đạt 500MB/s. Điều đáng học là thay thế literal object bằng classes hoặc Object.setPrototypeOf giúp tăng hiệu năng lên 2x, đạt 1GB/s throughput trong Node core.

Tìm hiểu cách tối ưu hiệu suất bằng cách loại bỏ nguyên mẫu null để tăng gấp đôi throughput trong Node.js.

SvelteKit 3 Reaches Release Candidate, Moving Config to Vite and Retiring the $lib Alias

SvelteKit 3 đang ở giai đoạn release candidate, tập trung vào tinh chỉnh code và chuẩn bị …

The Node.js and Express.js Handbook for Beginners – Servers, Routes, Routers, and Views Explained

Node.js là runtime environment cho việc thực thi JavaScript ngoài trình duyệt web. Bài viết giải thích cách xây dựng server, routes, routers và views trong Express.js framework cho các ứng dụng back-end. Node.js cung cấp APIs và công cụ cần thiết để phát triển từ các script nhỏ đến ứng dụng quy mô lớn. Bài hướng dẫn này sẽ giúp lập trình viên nắm vững các khái niệm cơ bản về xây dựng ứng dụng web server với Node.js và Express.js.

Bài viết này cung cấp kiến thức nền tảng cần thiết để xây dựng ứng dụng back-end với Node.js và Express.js từ cơ bản đến nâng cao.

How to Use the Fullscreen API in JavaScript (and Keep the Screen Awake with the Wake Lock API)

Các nhà phát triển front-end thường nhận yêu cầu triển khai chế độ fullscreen cho ứng dụng như slide deck, video player hoặc game. Để đạt được điều này, bạn có thể sử dụng Fullscreen API trong JavaScript, cung cấp phương thức element.requestFullscreen() để kích hoạt chế độ toàn màn hình. Vấn đề phát sinh khi thiết bị tự động tắt màn hình, cần sử dụng Wake Lock API với phương thức navigator.wakeLock.request() để ngăn điều này xảy ra. Hai API này kết hợp tạo giải pháp hoàn chỉnh cho trải nghiệm fullscreen ổn định, đặc biệt hữu ích cho các ứng dụng cần màn hình luôn bật như lớp học trực tuyến hoặc trạm giám sát.

Bài viết hướng dẫn bạn triển khai tính năng toàn màn hình và giữ màn hình luôn sáng với JavaScript API cho các ứng dụng đa dạng.

React for Vue Developers, 2: State, Effects, Re-renders

React 19 render lại toàn bộ component function khi có thay đổi, khác biệt cơ bản so với Vue 3 theo dõi dependencies và update tại chỗ. Trong React, mỗi khi state thay đổi, component sẽ được thực thi lại hoàn toàn, dẫn đến việc effects sẽ chạy lại. React cung cấp useMemo/useCallback để tối ưu hóa việc tái tạo lại các giá trị và hàm, tương tự tính toán memoized trong Vue. Hiểu rõ lifecycle hooks và cơ chế render của React giúp chuyển đổi từ Vue một cách hiệu quả, đặc biệt khi làm việc với các dự án lớn cần quản lý state phức tạp.

Bài viết này giúp lập trình viên chuyển đổi từ Vue sang React hiểu rõ cách React xử lý state, effects và re-render khác biệt với Vue dependency tracking.