Octane: React's Programming Model, Compiled

Octane – React's programming model, compiled

Octane: React's Programming Model, Compiled

Octane is a compiler-based React successor that eliminates the virtual DOM, rules of hooks, and dependency arrays. It compiles components ahead of time, allowing hooks behind conditions and automatic dependency tracking. Octane claims to be faster than React while maintaining a familiar API, and offers incremental migration paths via OctaneCompat and .tsrx files. Benchmarks show significant performance gains over React in many scenarios.

The compiler does the extra work, so your code doesn’t have to.
  1. rco8786

    > Measured, not vibes

    Sort of ironic considering that there are a LOT of vibe tells in the copy throughout this page. It's a neat looking project, it's a shame that every other sentence has Claude's fingerprints all over it.

  2. Guillaume86

    Just took a glance so I may be completely wrong, fell free to ignore, but if I understand correctly, tsrx is just syntactic sugar for normal tsx code and does not enable anything new?

    If this is the case: I think introducing tsrx as part of Octane muddies the water a bit and makes me more hesitant to try (even if it is optional).

    The idea to make tsx files more readable may be interesting but in that case it should go into its own separate project, and maybe just put a lang toggle in Octane docs and a page about tsrx compat, that way if people are intrigued by the new syntax they can just look it up but the docs stay focused.

  3. adzm

    An interesting feature is this:

    > A current-state getter. useState and useReducer return [state, update, getState], so a delayed callback can read the latest value instead of a stale capture.

    There are currently a few workarounds in React for this, and using other state management libs also give you non-reactive access to current state, but this is a big help in certain situations.

    For example, a callback / event that you pass to all your child elements, that needs to access the current state when run, therefore normally needs to be recreated with the new state captured (in useCallback) whenever state changes, which then causes all child components to re-render. Non-reactive access to current state in callbacks avoids this entirely.

    There are some hacks that fix this by wrapping the updated callback in a ref and updating it with an event (for example, https://usehooks-ts.com/react-hook/use-event-callback useEventCallback as implemented various places) and returning a stable reference to a function that calls that saved one, though I always wonder if there are downsides to this.

  4. vivzkestrel

    - please post 10 new frontend frameworks daily to HN

    - i ll take that over the AI, GPT, LLM, Agent stuff on HN anyday now

  5. ricardobeat

    Would look more appealing without the AI flavour. If you're vibe coding, do yourself a favor and write website copy yourself - it's the only evidence of human input or oversight your project will have.

More from this day

2026-08-03