RFC: Roadmap to v1.0.0 (Production-Ready React Native & Expo Tailwind CSS v4 Engine)

[ryenguyen7411]

🗺️ Roadmap to v1.0.0: Production-Ready React Native & Expo Tailwind CSS v4 Engine

Overview

@colorye/react-native-css is a high-performance, Rust SWC–powered Tailwind CSS v4 and standard CSS compiler for React Native & Expo. Following v0.3.1, this roadmap outlines key milestones and architecture requirements to achieve a bulletproof, zero-config, production-ready v1.0.0 release.

---

🎯 Core Objectives for v1.0.0

1. Zero-Friction DX (Zero-Config): Eliminate manual exports resolution like exported-stylesheet.json, provide plug-and-play Metro preset (withReactNativeCss), and automatic watch/build orchestration.
2. Full Tailwind CSS v4 Parity: Native handling for @theme, OKLCH/color-mix natively compiled, container queries, CSS variables resolution, and advanced pseudo-classes.
3. 100% Native Rust SWC Pipeline: Transition all Babel transformations completely to Rust SWC for 10x-20x bundling speedups while preserving exact JSX SourceMaps (v3).
4. Universal Prebuilt Binaries: Robust multi-platform N-API binary distribution across Darwin (arm64/x64), Linux (x64/arm64 gnu/musl), and Windows (x64 MSVC), with WASM / JS fallback.
5. Comprehensive Benchmark & Conformance Suite: Real-world stress testing on large production codebases (Expo 54+, Expo 57+, RN 0.81-0.86+) with zero regressions.

---

📌 Milestone Breakdown

Milestone 1: Tooling & Zero-Config Metro Integration

• Metro Plugin (withReactNativeCss): Provide an out-of-the-box Expo / Metro wrapper (const { withReactNativeCss } = require("@colorye/react-native-css/metro")) that automatically registers the CSS transformer, fast Rust JSX transformer, and Tailwind in-process compiler.
• Deprecate & Clean up exported-stylesheet.json import:
  • Remove manual import stylesheet from "@colorye/react-native-css/exported-stylesheet.json" from user applications.
  • Automatically resolve and load compiled stylesheets via Metro virtual modules or project index.css.json generated in-process.
• Fast HMR / Fast Refresh Stability: Ensure instant CSS variable & theme hot-reloads without requiring full Metro server restarts or clear-cache.

Milestone 2: Rust SWC Transformer Enhancements (crates/transformer)

• 100% Babel-free Path: Move inheritStyle cascading, nested child inspection, and GroupContext injection entirely into the Rust SWC visitor.
• Complex Template Literals & Ternary Optimization:
  • Extend AST hoisting for deeply nested ternary conditions and boolean conditionals (isActive && "font-bold").
  • Hoist static objects to module-level StyleSheet.create (_rnStyles) so runtime allocation is strictly 0ms.
• Precise SourceMap v3 Mapping: Ensure breakpoints and stack traces in React Native Debugger and Chrome DevTools map 1:1 to original .tsx source lines.
• WASM / Pure JS Fallback: Deliver @colorye/react-native-css/wasm as an automated fallback when running on unsupported environments (e.g. CI containers or exotic CPU architectures).

Milestone 3: Styling & CSS Feature Parity

• Tailwind CSS v4 @theme & Arbitrary Values:
  • Support full runtime variable cascades (var(--my-color, default)).
  • Native color-mix interpolation (color-mix(in oklab, ...)).
• Platform Variants & Media Queries:
  • Direct support for platform utilities: ios:pt-4, android:elevation-2, web:cursor-pointer.
  • Dynamic orientation and screen dimension media queries (@media (min-width: ...)).
• CSS Animation & Reanimated Transitions:
  • Seamless bridge between Tailwind transition utilities (transition-all, duration-300, ease-out) and React Native Reanimated.

Milestone 4: Multi-Platform Prebuilds & CI/CD

• Expanded Prebuild Matrix:
  • aarch64-apple-darwin (Apple Silicon M-series)
  • x86_64-apple-darwin (Intel Mac)
  • x86_64-unknown-linux-gnu & aarch64-unknown-linux-gnu
  • x86_64-unknown-linux-musl & aarch64-unknown-linux-musl (Alpine Docker)
  • x86_64-pc-windows-msvc
• Automated GitHub Actions Release:
  • GitHub Actions tag-triggered multi-target compilation with provenance and npm automated publishing.
  • Automated smoke tests on sample Expo apps before every npm release.

Milestone 5: Documentation, Showcase & Community

• Interactive Documentation Site: Quickstart guides for Expo SDK 54-57+, bare React Native, and migration from NativeWind v4.
• Micro-Benchmark Suite: Public benchmark charts comparing Rust SWC vs Babel vs NativeWind in build time, memory footprint, and re-render frame rates.
• Master Showcase Demo App: Polished showcase repository exhibiting complex themes, dark/light modes, animations, and group cascades.

---

💬 Feedback & Discussion

Contributions, RFCs, and feedback are welcome! Please comment below with specific pain points, features you'd like to see, or pull requests.