React Conf 2025 (Ngày 1)

Tuần trước đã diễn ra hội nghị React 2025.

Trong ngày đầu tiên, các bài trình bày chủ yếu xoay quanh những chủ đề liên quan đến React.

• React Keynote

  • Công bố React 19.1 (Owner Stacks), 19.2 (Activity/useEffectEvent/Partial Pre-rendering), Canary (View Transitions)
  • React Compiler 1.0 chính thức ra mắt, cung cấp tự động memoization và phân tích mã
  • Thành lập React Foundation, bắt đầu mô hình quản trị lấy cộng đồng làm trung tâm

• View Transitions and Activity

  • Với <Activity />, có thể chuyển đổi trạng thái visible/hidden và tự động giữ nguyên state mà không cần lift-up state
  • Với <ViewTransition />, có thể triển khai animation mang tính khai báo ngay cả trong Server Components
  • Xử lý quản lý trạng thái UI và animation theo cách composable và declarative

• Profiling with React Performance Tracks

  • Từ React 19.2, Chrome DevTools hỗ trợ trực quan hóa timeline công việc của React
  • Xác định điểm nghẽn hiệu năng qua Scheduler/Components/Server Components Track
  • Bổ sung Suspense Panel để trực quan hóa trạng thái của Suspense boundary (ra mắt vào cuối năm 2025)

• In case you missed the memo

  • Sanity Studio dùng React Compiler để memoize hơn 1.000 component, cải thiện hiệu năng trung bình 20~30%
  • Có thể tối ưu hóa chi tiết hơn (đăng ký context có điều kiện, branch memoization) và phát hiện bug
  • Khuyến nghị áp dụng ngay để tập trung vào "Make it work" mà không phải lo về memoization

• Async React

  • Transitions, Suspense và Server Components là kiến trúc mới để xây dựng ứng dụng bất đồng bộ
  • Giải quyết hiện tượng nhấp nháy ở loading states bằng Suspense, router và caching
  • Điều phối data fetching và UI updating bằng cách tích hợp startTransition với animation

• React and AI

  • Meta sử dụng AI cho sửa bug và khám phá mã, đồng thời chèn ngữ cảnh bằng LLM rules
  • Tập trung vào việc xác định đúng context và dùng AI như một đối tác pair programming
  • API ổn định của React là nền tảng để xây dựng công cụ AI, đồng thời mở ra cơ hội chuyển hướng nghề nghiệp sang AI Engineer

• Exploring React Performance

  • Cân bằng giữa Data Model và Rendering Algorithm là quan trọng, và React Compiler giúp cải thiện hiệu năng
  • Cách tiếp cận domain-specific vượt trội hơn các thuật toán tăng dần mang tính tổng quát
  • Tận dụng Transitions, Suspense, Virtualization, <Activity /> và Data Modeling

• The invisible craft of great UX

  • Những chi tiết nhỏ như click-drag-thả, popover theo từng OS, hay độ trễ tooltip có ảnh hưởng lớn đến UX
  • Giải quyết vấn đề bằng cách diễn giải ý định của người dùng thay vì chỉ dựa vào DOM event, như cố định/tức thời di chuyển scrub cursor
  • Cải thiện hiệu năng bằng cách tái sử dụng nhiều popover dưới dạng một phần tử duy nhất (300 cái → 1 cái)

• Building an MCP Server for a React Component

  • MCP là tiêu chuẩn mã nguồn mở để kết nối AI với hệ thống bên ngoài, cung cấp phương thức chuẩn hóa như USB-C
  • AG Grid nhúng 360 nghìn tài liệu và lưu vào Postgres để cung cấp ngữ cảnh chính xác cho LLM
  • Hỗ trợ tìm kiếm tài liệu và tạo component nhanh thông qua Prompts/Resources/Tools

• Why React Native apps make all the money

  • React Native cho kết quả vượt trội về tỷ lệ chuyển đổi trả phí, doanh thu trên mỗi lượt cài đặt và LTV
  • Phát triển cross-platform giúp ra mắt nhanh và áp dụng chiến lược kiếm tiền nhất quán
  • RevenueCat SDK hỗ trợ kiếm tiền thuận tiện với paywall, phân tích và thử nghiệm giá

• Modern emails using React

  • Phát triển email khó vì nhiều thuộc tính CSS không được hỗ trợ và khác biệt render giữa các client
  • React Email hỗ trợ xây dựng theo component, kiểm thử tương thích và kiểm tra liên kết
  • Chuyển đổi sang HTML bằng hàm Render, và Resend API đang được các doanh nghiệp lớn sử dụng

• React team Q&A

  • React Compiler có thể được áp dụng an toàn nếu tuân thủ Rules of React; với mã mới thì không cần useMemo/useCallback
  • AI được dùng như đối tác pair programming, và năng lực thiết kế kiến trúc là quan trọng
  • Trong 5 năm tới, React Foundation sẽ giảm dần vai trò của Meta, mở rộng cộng đồng và kêu gọi một bầu không khí thân thiện hơn

[nayounsang1]

Cảm ơn bạn

[soaple]

Cảm ơn!

[bluekai17]

Nội dung cập nhật của React Native 0.82 hình như cũng khá đáng kể đấy chứ.

[soaple]

Vâng, đúng vậy haha

Các bài thuyết trình liên quan đến React Native phần lớn được trình bày vào ngày thứ hai, nên có lẽ bạn xem nội dung các bài thuyết trình ngày thứ hai bên dưới sẽ hữu ích hơn!

https://vi.news.hada.io/topic?id=23670

[addons]

Cảm ơn, tôi đã đọc rất thú vị!

[soaple]

Cảm ơn!

[soaple]

Vì nội dung bài trình bày khá dài, nên nếu bạn muốn xem toàn bộ thì có thể tham khảo bài viết ở liên kết.

Tôi cũng sẽ sớm tổng hợp và đăng nội dung bài trình bày của ngày thứ hai!