React Conf 2025 (Ngày 2)

Tiếp nối bài viết trước, đây là phần tóm tắt các bài thuyết trình trong ngày thứ hai của React Conference 2025.

Ngày thứ hai chủ yếu là các bài thuyết trình liên quan đến React Native.

Nếu bạn muốn xem toàn bộ nội dung, có thể tham khảo bài viết ở liên kết nhé!

• React Native Keynote

  • Lượt tải React Native tăng trưởng 100% (4 triệu mỗi tuần), bản phát hành 0.82 bật mặc định New Architecture và hỗ trợ thử nghiệm Hermes V1
  • Bổ sung React Strict DOM và DOM APIs để hội tụ với web, chia sẻ các trường hợp thành công như Shopify/Starlink
  • Expo SDK 54, tăng cường bảng hiệu năng của DevTools, tích hợp sẵn Vega OS để mở rộng sang các nền tảng tương lai

• React Native, Amplified

  • Vega OS của Amazon: hệ điều hành dựa trên Linux tích hợp React Native, hỗ trợ các thiết bị như Fire TV và cải thiện 30% hiệu quả tài nguyên
  • Với React Native for Vega(@amazon-devices/react-native-kepler), có thể chia sẻ thư viện giữa các ứng dụng, tiết kiệm 10-12MB dung lượng lưu trữ
  • Vega Developer Tools Public Beta, hỗ trợ porting như Rock, tăng tốc phát triển bằng các công cụ AI (Amazon Q, Kiro)

• React Strict DOM

  • Để giải quyết sự tách rời giữa web và native, react-strict-dom: polyfill HTML/CSS để xây dựng một UI React duy nhất ("Learn Once, Write Once")
  • Ứng dụng Facebook VR của Meta đã chia sẻ thành công 60% mã web, cải thiện hiệu năng native gấp 2.5 lần
  • Tương lai: mở rộng hỗ trợ 63% DOM API, hợp nhất animation/styling đa nền tảng, tối ưu cho việc huấn luyện AI

• Reimagining Lists in React Native

  • Để giải quyết vấn đề Blanking List (nội dung biến mất khi cuộn), thử nghiệm <VirtualView />: component điều khiển độ ưu tiên render đồng bộ/bất đồng bộ
  • Tối ưu danh sách ảo hóa bằng Virtual Collections, tách chế độ visible/prerender, dự kiến tài liệu hóa trong bản phát hành 0.83
  • Với việc New Architecture trở thành mặc định, hiệu năng đạt mức của framework UI di động, đang kêu gọi phản hồi từ cộng đồng

• React Everywhere: Bringing React Into Native Apps

  • Để vượt qua giới hạn của WebView (UX giảm, nghẽn hiệu năng), React Native Brownfield: chèn dần các view RN vào ứng dụng native hiện có
  • Dùng công cụ rock để đóng gói ứng dụng RN thành AAR/XCFramework, chia sẻ mã universal bằng react-strict-dom/Nativewind
  • Tối đa hóa hiệu quả cross-platform với chiến lược ownership bởi một đội duy nhất và migration từ WebView → RN

• How Parcel Bundles React Server Components

  • Parcel v2.14 hỗ trợ RSC: hợp nhất module graph của server/client, tạo proxy và tự động preload bằng chỉ thị "use client"
  • Loại bỏ Network Waterfalls: dynamic import phía server với zero latency, xử lý CSS side effect, tối ưu code splitting
  • Triển khai RSC độc lập với framework ở lớp bundler, áp dụng SSR có chọn lọc để tăng hiệu năng/tính linh hoạt

• Designing Page Transitions

  • Animation giữa các trang server-rendered bằng View Transitions API: opt-in với <ViewTransition />, cung cấp crossfade mặc định
  • Tùy biến hướng/phần tử chia sẻ bằng Next.js Custom Link, tạo UX mượt hơn với motion blur/easing
  • Animation ảnh tĩnh hiệu năng cao bằng browser pseudo-elements, đơn giản hóa phát triển nhờ ủy quyền coordination cho React

• Build Fast, Deploy Faster—Expo in 2025

  • Expo SDK 54: mặc định React Compiler, tích hợp ngay các hiệu ứng native như liquid glass, EAS Build nhanh hơn 4 lần
  • Tự động hóa EAS Deploy/TestFlight để triển khai trong 5 phút, Expo Launch cho phép phát hành App Store chỉ với một cú nhấp
  • Hỗ trợ CSS native (tương thích Tailwind), demo AI Copilot tạo ứng dụng Pokédex trong 40 giây

• The React Router take on RSC

  • Bật RSC bằng plugin Vite, áp dụng dần vào ứng dụng hiện có: chuyển loader → async Server Component
  • Áp dụng RSC độc lập theo nested routes, đơn giản hóa form/action bằng Server Actions, lưu ý với "use client"
  • Hỗ trợ routing/data loading type-safe và kết hợp client-server để tăng tính linh hoạt full-stack

• RedwoodSDK: Web Standards Meet Full-Stack React

  • Framework web standards dựa trên Vite: route functions, interrupters/middleware, tối ưu cho Cloudflare Workers
  • Hỗ trợ server-first RSC streaming, WebSockets thời gian thực, no-JS SSR → hydration → View Transitions
  • Triển khai chỉ với một lệnh pnpm release, tích hợp Durable Objects/DB để kiểm soát tài liệu hoàn chỉnh

• TanStack Start

  • Full-stack theo hướng client-first: routing/data loading type-safe dựa trên TanStack Router, có thể bật/tắt SSR
  • Tạo ứng dụng bằng CLI, server functions/middleware, API routes theo file, tích hợp add-ons (Prisma/Neon)
  • Nâng cấp lên full-stack nhưng vẫn giữ mô hình SPA, nhấn mạnh sự ổn định của hệ sinh thái React nhờ phát triển do cộng đồng dẫn dắt

• What's The Framework of the React Future?

  • Thảo luận panel: xu hướng hội tụ giữa Next.js (Partial Prerendering), Remix (RSC bắt buộc), Expo (universal), TanStack Start (type-safe)
  • Tích hợp AI/LLM: mô hình cục bộ, giao thức MCP, streaming SSR đang đổi mới cách phát triển/vận hành triển khai
  • Tầm nhìn của React Foundation: hội tụ siêu dữ liệu framework, signals/store bên ngoài, nhu cầu kiểm soát hiệu năng chi tiết

• Async React (continued)

  • Giải quyết vấn đề của ứng dụng TODO đồng bộ: cải thiện UX giật lag bằng Transitions/Suspense/useOptimistic, thêm animation với View Transitions
  • Mẫu action props (React 19): tự động xử lý transition/mutation, tích hợp sẵn trạng thái loading
  • Async React WG: chuẩn hóa router/data/design, hướng tới kiến trúc async khai báo thân thiện với cả AI và con người