solidjs/solid

📦 The Big Ideas

• Async is first‑class: computations can return Promises (or async iterables) and the graph knows how to suspend/resume work.
• `<Loading>` is for initial readiness: show a fallback while a subtree can’t produce UI yet — then keep the UI stable while background work happens.
• Pending UI is an expression, not a flag: `isPending(() => expr)` tells you when “refreshing…” work is in flight without tearing down the UI.
• Mutations have a home: `action(...)` + optimistic primitives (`createOptimistic`, `createOptimisticStore`) let you write “optimistic → await → refresh” as one coherent flow.
• Derived state is a primitive: function forms like `createSignal(fn)` and `createStore(fn)` make derived-but-writable patterns explicit and composable.
• A more predictable scheduler: updates are microtask‑batched, and reads don’t update until the batch flushes (use `flush()` only when you truly need “settle now”).
• Dev guardrails: dev warnings catch accidental “top-level reads” in components and writes in reactive scopes before they become async bugs.
• DOM model cleanup: `use:` directives are replaced by `ref` directive factories (with array composition), and `classList` is folded into `class`.

📦 Stable async UI: `<Loading>` for first render, `isPending` for revalidation

• ```jsx
• const users = createMemo(() => api.listUsers());
• const refreshing = () => isPending(() => users());
• <>
• <Show when={refreshing()}>{/* subtle "refreshing…" UI */}</Show>
• <Loading fallback={<Spinner />}>
• <UserList users={users()} />
• </Loading>
• + 2 more

📦 Mutations that read clearly: `action` + optimistic store + `refresh`

• ```js
• const [todos, setOptimisticTodos] = createOptimisticStore(() => api.getTodos(), []);
• const addTodo = action(function* (todo) {
• setOptimisticTodos(todos => {
• todos.push(todo)
• }); // optimistic UI
• yield api.addTodo(todo); // server write
• refresh(todos); // recompute derived reads
• + 2 more

📦 Batching that’s deterministic: reads update after `flush()`

• ```js
• const [count, setCount] = createSignal(0);
• setCount(1);
• count(); // still 0
• flush();
• count(); // now 1
• ```

💥 Breaking changes you’ll notice quickly

• List rendering: `Index` is replaced by `<For keyed={false}>`, and `For` children receive accessors (`item()` / `i()`).
• Effects & lifecycle: `createEffect` is split (compute → apply), and `onMount` is replaced by `onSettled` (which can return cleanup).
• Stores: setters are draft-first by default; `storePath(...)` exists as an opt-in helper if you want the old path-style ergonomics.
• DOM: `use:` directives are removed; use `ref` directive factories (and arrays) instead.

📦 Try the beta

• Start with the migration guide:
• Beta tester guide: [`documentation/solid-2.0/MIGRATION.md`](https://github.com/solidjs/solid/blob/next/documentation/solid-2.0/MIGRATION.md)
• Then dive into specific topics when you need details:
• Reactivity & effects: [`documentation/solid-2.0/01-reactivity-batching-effects.md`](https://github.com/solidjs/solid/blob/next/documentation/solid-2.0/01-reactivity-batching-effects.md)
• Ownership & context: [`documentation/solid-2.0/02-signals-derived-ownership.md`](https://github.com/solidjs/solid/blob/next/documentation/solid-2.0/02-signals-derived-ownership.md)
• Control flow: [`documentation/solid-2.0/03-control-flow.md`](https://github.com/solidjs/solid/blob/next/documentation/solid-2.0/03-control-flow.md)
• Stores: [`documentation/solid-2.0/04-stores.md`](https://github.com/solidjs/solid/blob/next/documentation/solid-2.0/04-stores.md)
• Async data: [`documentation/solid-2.0/05-async-data.md`](https://github.com/solidjs/solid/blob/next/documentation/solid-2.0/05-async-data.md)
• + 2 more

📦 Conclusion

• Big thanks to @milomg, @mihar-22, @devagrawal09, @titoBouzout, @tannerlinsley, @lxsmnsyc, @GabbeV, @brenelz, and everyone else that has contributed code, time, ideas, and testing for this release.
• Best Regards,
• @ryansolid

📦 Custom Element improvements

• We've also improved our event handler delegating retargetting to better handle shadow DOM events. There were cases where we skipped over part of the tree.
• ```js
• <my-element bool:enable={isEnabled()}></my-element>
• ```

📦 Support for handleEvent Syntax in Non-Delegated Events

• A little known thing is that events actually also support objects instead of functions (See: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener)
• Instead using `on:` you can set the event properties you wish.
• ```js
• <>
• <div on:click={{
• handleEvent(e) {
• console.log("clicked", e)
• },
• + 12 more

📦 Other Updates

• We've fixed an issue with lazy images. Apparently, cloneNode doesn't handle them properly so we've updated our heuristic to treat templates with lazy images to be handled with `importNode`.
• Finally, we've improved some of the types in the JSX and Signal Setter in this release.
• -------------
• Best,
• @ryansolid

📦 Better Guards on Global Scripts

• ---------
• Thanks,
• @ryansolid

📦 Null-Asserted Control Flow

• The main difference is the callback form instead of passing in the value as it does when `keyed`, passes in a function that is type narrowed.
• ```js
• // keyed w/ callback - reruns full callback on change
• <Show when={user()} keyed>
• {nonNullUser => <div>{nonNullUser.name}</div>}
• </Show>
• // non-keyed w/o callback... - only updates the one expression, needs ! assertion
• <Show when={user()}>
• + 8 more

📦 Better Event Types for Input Elements

• Now `onInput`, `onChange`, `onBlur`, `onFocus`, `onFocusIn`, and `onFocusOut` all support more detailed `target` when applied to `HTMLInputElement`, `HTMLTextAreaElement`, and `HTMLSelectElement`.

📦 Stricter JSX Elements

• Solid's JSX needs to accept functions to handle dynamic insertion. However, in authoring it leads to awkward situations.
• You first hit this the first time use Solid. You create that counter and don't call `count` as a function and it works.
• ```js
• function Counter() {
• const [count, setCount] = createSignal(1);
• return <button onClick={() => setCount(c => c + 1)}>{count}</button>;
• }
• ```
• + 49 more

📦 `catchError` replaces `onError`

• ```js
• catchError(
• () => {
• // do stuff
• throw new Error("I've Errored");
• },
• err => console.log(err)
• );
• + 2 more

📦 Others

• Smaller compiled output, remove auxilary closing tags
• Support for `prop:` and `attr:` in Spreads
• Don't apply special props (like `readonly`) to custom elements
• Reverse cleanup execution order at the same level
• Introduced improved serializer, [seroval](https://github.com/lxsmnsyc/seroval)
• Fixed quirks in Solid's treeshaking in Rollup
• Minify inline class and style attributes
• Update `solid-ssr` to type `"module"`
• + 3 more

📦 Official Partial Hydration Support

• The power here is static markup can interleave dynamic components.
• ```js
• <h1>Server Rendered Header</h1>
• <Island>
• <h2>Server Rendered Sub Header</h2>
• <p>{serverOnlyResource().text}</p>
• <DifferentIsland>
• <p>More server-renderd content</p>
• + 12 more

📦 Native Spread Improvements

• In 1.6 we have smartened spread to merge properly using a similar approach to how we process Components.
• ```js
• // A`class` property in `props` now takes priority even if someSignal() updates.
• // In fact it won't even be subscribed to unless props does not have a `class` property.
• <div class={someSignal()} {...props} />
• ```
• We've also found new ways to optimize the experience. (See below).

📦 Deproxification

• So now if you don't use a `Store` or swap out the props object:
• ```js
• // this is fine
• <div {...props} />
• // these could swap out the object so they make proxies
• <div {...props.something} />
• // or
• <div {...someSignal()} />
• + 3 more

📦 Note on the title

• So whether that is for you, Laputa, Skyloft, Zeal, Skypiea, Sanctaphrax, or some other, I wish you luck on your journey upwards.
• Best, @ryansolid

✨ New Batching Behavior

• ```js
• const store = createMutable(["a", "b", "c"]);
• const move = store.splice(1, 1);
• store.splice(0, 0, ...move);
• // solid 1.4
• // ["b", "a", "b", "c"];
• // solid 1.5
• // ["b", "a", "c"];
• + 1 more

📦 More Powerful Resources

• ```js
• const [user] = createResource(fetchUser, {
• initialValue: globalThis.DATA.user,
• ssrLoadFrom: "initial"
• });
• ```
• | state | value resolved | loading | has error |
• | ---------- | -------------- | ------- | --------- |
• + 24 more

📦 Keyed Control Flow

• This worked pretty well except it was not obvious that a callback was keyed. So in 1.5 we are making this behavior explicit. If you want keyed you should specify it via attribute:
• ```js
• // re-render whenever user changes
• // normal
• <Show when={user()} keyed>
• <div>{user().name}</div>
• </Show>
• // callback
• + 6 more

📦 `children.toArray`

• Children helper now has the ability to be coerced to an array:
• ```js
• const resolved = children(() => props.children);
• resolved.toArray(); // definitely an array
• ```

📦 Better SSR Spreads

• Finally fixed spread merging with non-spread properties during SSR, including the ability to merge children.

📦 Better Error Handling

• We weren't handling falsey errors previously. Now when Solid receives an error that isn't an `Error` object or a string it will coerce it into an `Unknown Error`.

📦 Migrated the Repo to pnpm and TurboRepo

• Thanks @modderme123 for taking the time to completely modernize our build setup. Making it way easier to contribute and drastically improve build and testing performance.

📦 NodeNext Support

• TypeScript 4.7 brought a new way to use package exports to resolve Types and with Solid 1.5 we now support this.

📦 Improved Tagged Template Literals

• Many fixes have been made to Tagged Template literal parsing (special thanks @trusktr) fixing many rough edges.

📦 Improved CSS Types

• Solid now uses `csstype` for better typing of the style property.

📦 `in` support in Stores

• The `in` operator is now tracked and auto-wrapped in the JSX.

🐛 Bug fixes

• Many small bug fixes, including:
• fragment hydration mismatch
• head/body elements included in templates
• comparison functions not called with no observers
• scheduling error in concurrent rendering
• deletion on createMutable
• --------------
• Sincerely,
• + 2 more

📦 Top Level Arrays in Stores

• ```js
• const [todos, setTodos] = createStore([
• { id: 1, title: "Thing I have to do", done: false },
• { id: 2, title: "Learn a New Framework", done: false }
• ]);
• // set at an index
• setTodos(1, done, true);
• // use an array
• + 4 more

📦 Resource Deferred Streaming

• But what if you want to stream but also want to wait on some key data loading so you still have an opportunity to handle the response on the server before sending it to the browser?
• We now have the ability to tell Solid's stream renderer to wait for a resource before flushing the stream. That you can opt-in by setting `deferStream` option.
• ```js
• // fetches a user and streams content as soon as possible
• const [user] = createResource(() => params.id, fetchUser);
• // fetches a user but only streams content after this resource has loaded
• const [user] = createResource(() => params.id, fetchUser, { deferStream: true });
• ```

📦 Stale Resource Reads

• ```js
• const [resource] = createResource(source, fetcher)
• // read it as usual
• resource();
• // read the latest (don't suspend if loaded at least once)
• resource.latest;
• ```
• Example: https://codesandbox.io/s/solid-stale-resource-y3fy4l

📦 Combining multiple Custom Renderers

• ```js
• import { HTMLElements, SVGElements } from "solid-js/web";
• let solidConfig = {
• moduleName: "solid-js/web",
• // @ts-ignore
• generate: "dynamic",
• renderers: [
• {
• + 13 more

📦 Synchronous Top Level `createEffect`

• These were originally deferred to a microtask to resemble how effects are queued under a listener. However it is more correct to run immediately like everything else top level.

📦 Sources in `createResource` are now Memos

• A small change but it was unusual to have refetching trigger a reactive expression outside of a reactive context. Now on refetch it grabs the last source value rather than re-running it.

📦 Better handling of `null` and `undefined`

• Spreads and classes in the JSX now handle these values without writing them as strings or throwing exceptions.

📦 `createMutable` batches array methods like push, pop, etc..

• Now these built-ins are batched and more performant. For instance using `push` or `splice` will only trigger updates once.
• We've also added `modifyMutable` that applies modifiers batched to stores created with `createMutable`.
• ```js
• modifyMutable(state.data.user, reconcile({ firstName: "Jake", middleName: "R" }));
• ```

📦 Better Support for React JSX transform

• We have added support to `solid-js/h` to support the new React JSX transform. You can use it directly in TypeScript by using:
• ```json
• {
• "jsx": "react-jsx",
• "jsxImportSource": "solid-js/h"
• }
• ```

📦 HyperScript now returns functions

• ```js
• const getDiv = h("div", "Hello");
• document.body.appendChild(getDiv()); // call as a function to have it create the element.
• ```
• Special thanks to @fabiospampinato for identifying and bringing this long-standing issue to our attention.

📦 HTML Streaming

• ```js
• // node
• const stream = renderToStream(() => <App />).pipe(res);
• // web
• const stream = renderToStream(() => <App />).pipeTo(writable);
• ```

📦 Error Boundaries on the Server

• This works now but there is more to explore here in improving Error handling in general with SSR. So look forward to feedback on the feature.

📦 Isolated Server Render/Hydration Contexts

• Also now you only need to include the Hydration Script once on the page. Each Island will be responsible for initializing it's own resources.
• ```js
• // on the server
• const html = renderToString(() => <Island1 />, { renderId: "island1" });
• // for the browser
• hydrate(() => <Island1 />, mountEl, { renderId: "island1" });
• ```

📦 `createReaction`

• ```js
• const [s, set] = createSignal("start");
• const track = createReaction(() => console.log("something"));
• // next time s changes run the reaction
• track(() => s());
• set("end"); // "something"
• set("final"); // no-op as reaction only runs on first update, need to call track again.
• ```
• + 1 more

📦 External Sources (experimental)

• ```js
• import { Reaction, makeAutoObservable } from "mobx";
• import { enableExternalSource } from "solid-js";
• import { render } from "solid-js/web";
• let id = 0;
• enableExternalSource((fn, trigger) => {
• const reaction = new Reaction(`externalSource@${++id}`, trigger);
• return {
• + 32 more

📦 `refetchResources` (experimental)

• Sometimes it's valuable to trigger `refetch` across many resources. Now you can.
• ```js
• import { createResource, refetchResources } from "solid-js";
• const userCache = {};
• function MyComponent(props) {
• const [data] = createResource(
• () => props.id,
• (userId, { refetching }) => {
• + 10 more

📦 Better SourceMaps

• Work has been done to improve sourcemaps by updating `babel-plugin-dom-expressions` to better preserve identifiers from the JSX. Thanks to @LXSMNSYC for exploring and implementing this.

📦 `startTransition` no longer takes callback as a second argument

• Instead it returns a promise you can await. This works better for chaining sequences of actions.
• ```js
• const [start, isPending] = useTransition();
• start(() => doSomething()).then(() => allDone());
• ```

📦 Resource fetcher info object replaces `getPrev`

• To streamline API for refetch we are slightly updating the `createResource`:
• ```js
• const [data] = createResource(sourceSignal, (source, { value, refetching }) => {});
• ```
• For those using existing 2nd argument:
• ```js
• const [data] = createResource(sourceSignal, (source, getPrev) => {
• const value = getPrev();
• + 4 more

🐛 Bug Fixes

• Fixed browser extensions modifying the head element breaking hydration.
• Fixed reinserting `<html>` on hydration from document.
• Fixed over-executing on multi-select with `createSelector`.
• Fixed event delegation conflicting with document event listeners.
• Fixed self owning source infinite recursion.
• Fixed faulty treesplitting for hydration in client only render.
• Fixed return type of `preload` on lazy components to always be a promise.
• Fixed compile error with leading white space after opening tags when generating ssr.

✨ New Features

• ```js
• // example custom dom renderer
• import { createRenderer } from "solid-js/universal";
• const PROPERTIES = new Set(["className", "textContent"]);
• export const {
• render,
• effect,
• memo,
• + 49 more

🐛 Fixes

• Previously spreads on components would only track property changes on bound objects and not when the whole object changed. This now works:
• ```js
• <MyComponent {...getStuff()} />
• ```
• It is common in libraries like Tailwind to apply multiple classes at the same time. There was an issue where true and false resolutions were cancelling each other out. This would only set `text-sm`.
• ```js
• <div
• classList={{
• + 10 more

📦 `createUniqueId`

• A universal id generator that works across server/browser.
• ```js
• const id = createUniqueId();
• ```
• > Note on the server this only works under hydratable components

📦 `from`

• ```js
• const signal = from(obsv$);
• ```
• It can also take a custom producer function where the function is passed a setter function returns a unsubscribe function:
• ```js
• const clock = from(set => {
• const t = setInterval(() => set(1), 1000);
• return () => clearInterval(t);
• + 3 more

📦 `enableScheduling` (experimental)

• Works like its counterpart in `useTransition`, this useful when you don't need pending state.
• ```js
• import { createSignal, startTransition } from "solid-js";
• function App() {
• const [signal, setSignal] = createSignal("Howdy");
• function clickHandler(e) {
• startTransition(() => setSignal("Holla"));
• }
• + 3 more

📦 setSignal now supports function form

• While that in itself is a great new feature as you can do:
• ```js
• const [count, setCount] = createSignal(0);
• setCount(c => c + 1);
• ```
• This promotes immutable patterns, lets you access the previous value without it being tracked, and makes Signals consistent with State.
• It means that when functions are stored in signals you need to use this form to remove ambiguity
• ```js
• + 7 more

🧪 `createState` moved and renamed

• `createState` has been renamed to `createStore` and moved to `solid-js/store`. Also moved to `solid-js/store`: `createMutable`, `produce`, `reconcile`
• https://github.com/solidjs/solid/blob/main/documentation/api.md#createstore

📦 SSR Entry points

• `renderToString` and `renderToStringAsync` now only return their stringified markup. To insert scripts you need to call `generateHydrationScript` or use the new `<HydrationScript>` component.
• `renderToNodeStream` and `renderToWebStream` have been replaced with `pipeToNodeWritable` and `pipeToWritable`, respectively.
• https://github.com/solidjs/solid/blob/main/documentation/api.md#pipetonodewritable

📦 on

• No longer uses rest parameters for multiple dependencies. Instead, pass an array. This facilitates new option to defer execution until dependencies change.
• https://github.com/solidjs/solid/blob/main/documentation/api.md#on

📦 Actions renamed to Directives

• To remove future confusion with other uses of actions the `JSX.Actions` interface is now the `JSX.Directives` interface.
• https://github.com/solidjs/solid/blob/main/documentation/api.md#use___

📦 Signals no longer always notify by default

• Solid's original behavior has been to always notify on signal change even if the value hasn't changed. The idea was to simulate stream behavior. However, this has some downsides:
• 1. Inconsistent with State.. I made the decision to make state equality check by default, it is weird signals and memo's do not.
• 3. It is consistent with other modern reactive libraries like MobX and Vue.
• The API has not changed. You can opt out of the default behavior by passing in your own comparator or false to the 2nd parameter of `createSignal` and the 3rd parameter of `createMemo`.
• My hope this is the last release before I start making 1.0 RC's. This one has big enough impact I want to get this out first. I imagine the remaining changes will be just syntax.

💥 Breaking Changes

• Minor difference to allow the first argument to be optional and support more features in the future. New full signature is:
• ```ts
• export function createResource<T, U>(
• fn: U | false | (() => U | false),
• fetcher: (k: U, getPrev: () => T | undefined) => T | Promise<T>,
• options?: { initialValue?: T }
• ): ResourceReturn<T>;
• ```
• + 10 more

✨ New Features

• Types added for Namespace attributes. You probably won't need most of these because they are for more advanced usage. However to use them you need to extend the JSX Namespace:
• ```ts
• declare module "solid-js" {
• namespace JSX {
• interface Actions { // use:____
• }
• interface ExplicitProperties { // prop:____
• }
• + 22 more

💥 Breaking Changes

• It's been a few versions deprecated. It's gone.
• Changed to more resemble SWR and React Query. Needed to remove `createResourceState`so now need to use a getter over `createResource` to get same effect. See updated documentation.
• They now return results objects that include the generated hydration script. No more need to generate it separately. Also comes autowrapped in the `script` tag now.
• While you use them the same way mostly it no longer has `Object.assign` semantics and always returns a new object. This is important as in many cases we need to upgrade to a Proxy.
• Removes confusion around context and consistent with new helper `runWithOwner`.

💥 Non-breaking Changes

• Through reusing static strings in the template we reduce repeated creation costs. This small improvement can make 5-8% improvements where you have many rows.

✨ New Features

• Resolves children and returns a memo. This makes it much easier to deal with children. Using same mechanism `<Switch>` can now have dynamic children like `<For>` inside.
• This is the way to package the JSX components to be compiled to work on server or client. By putting the "solid" condition the source JSX will be prioritized over normal browser builds.

🐛 Bug Fixes

• Top level primitive values not working with `reconcile`
• Fix Dynamic Components to handle SVG
• Rename potentially conflicting properties for event delegtion
• Fixed State spreads to not loose reactiviy. Added support for dynamically created properties to track in spreads and helpers
• TypeScript, always TypeScript

📦 Dev Mode

• We also export a `serializeGraph` method which will serialize all the signals below the executing context in the reactive graph.
• Finally there is a new `globalThis._$afterUpdate` hook that can be assigned that will be called after every render that can be used for tracking purposes.
• This is just the start but it is my intention to develop these features to allow for better HMR and DevTools.
• > Note: If the libraries are not being pulled into your bundle and are treated as external you may need to alias `solid-js` to `solid-js/dev` in your bundler in order to use dev mode.

📦 Self contained HyperScript/Lit Modules

• ```html
• <html>
• <body>
• <script type="module">
• import { createSignal, onCleanup } from "https://cdn.skypack.dev/solid-js";
• import { render } from "https://cdn.skypack.dev/solid-js/web";
• import html from "https://cdn.skypack.dev/solid-js/html";
• const App = () => {
• + 11 more

📦 renderToWebStream

• New `renderToWebStream` for synchronous SSR mode. This allows us to stream from things like Cloudflare Workers.

📦 createMutable

• ```js
• const user = createMutable({
• firstName: "John",
• lastName: "Smith",
• get fullName() {
• return `${this.firstName} ${this.lastName}`;
• },
• set fullName(value) {
• + 11 more

📦 State Getter/Setters are now Wrapped

• Getters are now wrapped in `createMemo` and setters in `batch`. However, this introduces a new limitation that they can only be top level to have this behavior.

📦 State compatible with Prop Helpers

• You can now use state with `assignProps` and `splitProps` helpers.

📋 Attribute and Prop changes

• While TypeScript 4.2 is yet to be released, we are introduce `attr`, `prop`, `use` and `style` namespace directives. To allow more expressiveness in binding syntax.

📋 Other Changes

• New `on` and `onMount` helpers
• More performant SSR escaping
• Lazy eval SSR Component props (fix SSR Context API)
• Add support for SSR with Solid Styled Components
• Fix Lit Dom Expressions style in Template tags
• Fix JSX Types

📦 `createSelector`

• New API to do delegated selection. Good for updating only the rows that change in large lists:
• ```jsx
• const [selected, setSelected] = createSignal();
• const isSelected = createSelector(selected);
• return <For each={list()}>{
• item => <li class={isSelected(item.id) ? "selected" : ""}>{item.text}</li>
• }</For>
• ````

📦 `as` prop in Styled Components

• Let's you override the element type in the view where used.

🗑️ Removed APIs

• `afterEffects`, `createDependentEffect`, and `suspend` have been removed as they no longer make sense with the new reactive system timing.

💥 Breaking Changes:

• ```js
• // top level
• setState(produce(s => {
• s.name = "John"
• }));
• // nested
• setState('user', produce(s => {
• s.name = "John"
• + 12 more

✨ New

• For convenience of passing derived values or external reactive expressions through Solid's state initializer you can now add `getter`'s.
• ```jsx
• const [state, setState] = createState({
• firstName: "Jon",
• lastName: "Snow",
• get greeting() { return `You know nothing ${state.firstName} ${state.lastName}` }
• });
• return <div>{state.greeting}</div>
• + 16 more

🐛 Bug Fixes & Updates

• Improved TypeScript Types.

📋 Changes

• Removal of `forwardRef`. Value and function handled by just `ref`.
• Change to how TypeScript is managed. Brought all JSX types inside the repo, and improved Component typing.
• Changed default renderer in `solid-ssr` to string renderer.
• Change inline styles to use `setProperty` and hyphenated or camelCase.

📦 Consolidation in preparation for release candidate

• Big refactor of core reactive system and render list reconciler
• Significantly smaller reducing core by atleast 3kb minified
• Better handling of nested reactive nodes in Fragments
• Update SSR mechanisms, added progressive event hydration, created repo for SSR environment (`solid-ssr`)
• `@once` compiler hint to statically bind values
• Better wrapping hueristics for booleans and ternaries in JSX

💥 Breaking Changes

• Removed `transform` prop from control flow. Idiomatic approach is to make a HOC for transformations of this nature.
• Removed selectWhen/selectEach control flow transforms.
• Changed event system
• `on____` prop to stop differentiating on case. Super confusing.Instead will try to delegate unless unable. Made TypeScript all CamelCase (although technically both forms behave identically)
• Removed `model` event delegation approach. Instead to create bound event use array: `onClick={[handler, row.id]}`. Inspired by Inferno's `linkEvent` helper.
• Renamed `events` prop to `on` prop
• Added `onCapture` prop for capture events

✨ Big changes to experimental features:

• New resource API `createResource` and `createResourceState` to replace `loadResource`. These are built to prioritize read capabilities and simplify implementation.
• Support for Async SSR `renderToString` now returns a promise. Uses Suspense to know when it is done.
• Progressive Hydration with code splitting support. Ability to track events and replay as hydration completes to reduce "uncanny valley". Components can be lazily loaded even during hydration. No support for async data on hydration yet, so render it from server and load into state synchronously.
• New error boundary api with `onError`. If an error occurs in context or child context the nearest handler/s will be called.
• Deprecating the `force` `setState` modifier as it is confusing.

📋 Changes

• Suspense improvements: `SuspenseList`, `useTransition`, trigger on read. Update API, and added `reload` and retry capability. Removed need for `awaitSuspense` by making `Show` and `Switch` control flows `Susepnse` aware.
• Sample all Components. No more fear of nesting Components in JSX expressions. Top level in a Component will always be inert now.
• Support for safe boolean and logical operators. This allows for the same optimization as the `Show` control flow for simple inline JSX conditionals like `<div>{state.count > 5 && <MyComp />}</div>`.
• Support for non-curried operator forms. All operators now support an accessor first form as well as the functional curried form. Ex `map(() => state.list, item => item)`
• Fix issues with spreading over `children` props.
• Better Type Definitions.

📋 Changes

• Adds diffing to batched computations to improve update performance
• Supports support for mutable(TypeScript safe) `setState` API inspired by Immer. Function setters in Solid now pass a mutable version of state. Modifying will schedule updates. This form must not return a value. It can still be used immutably simply by returning the new value.
• Changes how `force` and `reconcile` helpers work. They can now be used on nested paths.
• Removes support for multi-path `setState`.

📋 Changes

• Dynamic insert expression (any expression between tags)
• Spread operator
• JSX template entry point(Top level tag, Fragment, or Component Children)

📋 Changes

• Removal of explicit dynamic binding `{( )}`, bindings will default to reactive unless impossible to be so (literal, function declaration, simple variable)
• SVG Camelcase attribute Support
• Prettier now supported!

📋 Changes

• Fix reactivity resolution ordering on downstream conditionals
• Add basic (non-namespaced) SVG support
• Add experimental Server Side Rendering and Client Side Hydration capabilities
• Add Suspense aware control flow transformation (`awaitSuspense`)
• Allow state objects to track functions
• More TypeScript definition improvements and fixes

📋 Changes

• Fixed synchronicity on all hooks/control flows.
• Adds the ability to use comparators on `createMemo`.
• Fixes bugs with nested control flows.
• Fixes bugs with Suspense.
• Update Suspense `delayMs` to `maxDuration` to match React. (Usage of `maxDuration` still experimental)

📋 Changes

• Optimized List reconciliation is exposed for any array passed as child nodes. This includes Fragments which are now also just arrays. This addresses issues like #37. One side effect is that dynamic bindings are not activated until attached and are made inert when detached. If you need to maintain context I suggest wrapping in a `createMemo` so that the value is remembered between inserts.
• Solid ships with Control Flow operators. However, you are not limited to them. While you should be conscious of wasted work, you can use any Components/functions to handle control flow. The control flow operators are much simpler now since they are independent of DOM manipulation.
• To support purely Reactive array iteration I reintroduced the `map` operator. I've added `pipe` and `reduce` as well. These are very basic but can serve as a basis for users to create Functional operators. They are in the same vein as RxJS pipe-able operators.
• The return type from JSX may be a Node, Function, or Array of those. Since not all JSX expressions return Nodes anymore the top level now needs to use `insert` from `solid-js/dom` instead of just appending the returned element. `solid-js/dom` now exports `render` for convenience which does both the `insert` and automatically wraps it with `createRoot`. This syntax is based on React's render.
• While still not perfect, some big improvements to TypeScript support, by removing both Custom Directives (use forwardRef binding instead) and `<$>` tag. New Control Flow also now has explicit type defs. JSX Children are now handled consistently with react.
• Newly released is also [babel-preset-solid](https://github.com/ryansolid/babel-preset-solid). This will take care of all the Solid specific configuration for the JSX plugin making it easier than ever to get started.

📋 Changes

• Universal loadResource API
• afterEffects hook
• Switch Control Flow