Roadmap to 0.1 (first available version)

[aralroca]

ROADMAP TO 0.1 (first version) 🚀

JSX Components

• Implement jsx-runtime
• async components
• async components error component (Component.error)
• async components loading component (Component.suspense)
• Improve context communication between server and web
• sync store between server render → client → server action → client #85
• Control server action pending status via indicator in server/web components #88
• Optimistic signal to work with Server Actions #87
• Optimistic updates via URL search params #138
• Form Server Actions without JavaScript #123
• allow transitions/animations between suspense and real content #140
• allow prefetch to improve SPA navigation + i18n translations #157
• Navigation with Transition API + streaming + keep context between pages #75
• implement renderMode attribute to <a> to change reactivity (default) | transition | native #182

Client (web components)

• Implement state
• Implement events
• Implement web-components in functional JSX components
• Implement reactivity in state and props changes
• Implement effects, onMount, derived and cleanup in web-components
• Serialize and deserialize objects as props in server components consuming web componentes and web-compoments consuming web-components
• Support rendering SVGElements in web components
• Support export const props = ['propName'] as optional to fix reactivity in web-components props when using props spread <div {...exampleProps} />
• Support custom hooks
• Implement attribute key to unmount / mount web components when change
• Support ref attribute to elements
• implement createPortal. Portals to support shared modals, etc
• Unregister JSX effects #9
• SSR web-components in renderToStream and do it configurable (ssr=false|true) #13
• Suspense and error handle in web-components #15
• Implement createContext, provider and useContext in server-components #20
• Implement store in web-components #23
• Implement createContext, provider and useContext in web-components #19
• Support Context API in Declarative Shadow Dom slotted elements (web-components SSR) #32
• allow to use reactive markup generators inside web-components #43
• Controlled and uncontrolled forms #46
• Integrate third party Brisa web components  #45
• Integrate third party native web components  #258
• Option to add custom signals, ex: sync store values with localStorage/sessionStorage #69
• Form data vía server, also upload file in an easy way #77
• Create debounce attribute in server events (ex: onInput-debounce={400}) #81
• UI-agnostic: React, Preact, Svelte, Vue, native web components... #152
• expose route (name, pathname, params, query) in WC + support SSR #369
• Implement useId #506

Server components

• Add request as second param of server components (to access to params, cookies, url, headers, etc)
• stream rendering
• Add store.transferToClient(['key']) to RequestContext to transfer store data to WebContext. #29
• render async generator lists and use it as server component #95
• Add encrypt option to store.transferToClient #98
• Auth and guards support #100
• Allow to reset forms from a server action #165
• Server actions and server events by default #47
• add rerenderInAction server actions feature  #73

Architecture

• Routing pages in Next.js way /pages/index.ts, /src/pages/index.ts, /src/pages/user/[slug].ts, /src/pages/user/[...slug].ts
• api folder
• access variable of dynamic routing
• hotreloading
• Assets (images, favicon, manifest, etc)
• use env variables inside server routes
• _404 and _500 page support
• support layouts (layouts.(tsx|ts|js) / layouts/index(tsx|ts|js)), it returns the request to render different layouts depending the page
• support middleware - middleware.(tsx|ts|js) / middleware/index.(tsx|ts|js)
• support "export Head" component in pages to overwrite head content (meta, links...) on the layout, using "id"
• Support websockets - websockets.(tsx|ts|js) / websockets/index.(tsx|ts|js) and add "ws" to RequestContext
• Support responseHeaders function that returns the headers object, in the page level and also layout level. Useful to control the cache or add some X-headers.
• use env variables inside browser events and interactivity #41
• Precompress assets (gzip+brotli) as optional #306
• Generate sitemap.xml according to src/sitemap.ts #482

Testing

•  render. Supporting "Server Components" (HTML elements) and "Web Components" (custom elements). Should also support a Response to use it together with serveRoute to render pages.
• serveRoute. Fetch some page or API endpoint and return the response.
• The render and serveRoute returns: container and cleanup.
• The render work with server actions and possible to test them
• The render work with signals and custom elements
• The render should support locale as option to test i18n translations in server and web components
• waitFor to wait for an "expect" assertion to pass.
• userEvent to simulate user events like click, type, hover, focus, etc.
• debug (similar to console.log(document.documentElement.outerHTML) but prettier and with colors in the HTML elements
• cleanup method to clear the document and server actions register
• Matchers to test DOM: toBeChecked, toHaveAttribute, toHaveTagName, toHaveTextContent, toBeInTheDocument, etc...

Brisa API

• dangerHTML helper: an alternative to React dangerouslySetInnerHTML allowing HTML without creating a new node
• Implement support ofdangerHTML in web-components
• Support notFound() function to control 404 status #38
• navigate util for imperative navigation #74
• Expose renderToString and renderToReadableStream API #124
• API support for throwable.is(), throwable.isRerender(), throwable.isNavigate(), throwable.isNotFound() #376
• expose fileSystemRouter API if you want to use in custom server
• Expose compilerWC API #484

CLI

• CLI dev
• CLI build
• CLI start
• CLI build: gzip assets
• CLI build: brotli assets #192
• Allow different port than 3000 using "bun dev -p 8080"
• Build of Server Components for library authors #421
• Build of Web Components for library authors #420

Internationalization (i18n)

• i18n routing - i18n.(tsx|ts|js) / i18n/index.(tsx|ts|js)
• i18n navigation
• Support to share context from the middleware to the components
• i18n routing extra: localeDetection
• i18n routing extra: save preferred language to BRISA_LOCALE cookie
• i18n routing extra: domains
• i18n consume translations in an easy way
• i18n routing extra: translate page name
• i18n routing extra: navigation with translated pages
• i18n routing extra: hreflang
• i18n: support html dir automatic vía getTextInfo #12
• i18n to consume translations in web-components #54
• i18n: support i18nKeys for dynamic keys (allow regex) #56
• i18n(server): overrideMessages to override default translations in request level to connect to external i18n services #64
• i18n(web-components): overrideMessages to override default translations to connect to external i18n services  #66
• web-components: format href and src for i18n, trailingSlash, assetPrefix... #55

Configuration

• trailingSlash (false by default but possible to change via configuration)
• Support assetPrefix config #3
• Allow plugins in the configuration for the build via extendPlugins #133
• Support TLS in brisa.config file #25
• Support basePath config #146
• Possibility to use a custom server #167
• clustering config to fork serve process for CPU core + load balancing  #429
• Add external in the configuration  #451

Optimizations

• compress JS client code with gzip and use cache-control with a hash for each chunk #50
• support FFI in the same build to use rust, zig, c functions #52

CSS

• Support inline styles prop as object #36
• add reactive css template literal to allow animations with signals #48
• Support css template literal for server components #136
• Support CSS imports + SSR in Web Components #156

DX

• Create a bun template
• enable type-safe consuming translations
• support type-safe of HTML elements (also web components) + their attributes and events  #34
• Improve type-safe of attributes (elements and customElements) #82
• DX: Improve error feedback to devs #31
• Write docs in a website in Vitepress (first step, then -> Brisapress) #92
• Migrate Brisa documentation to Brisapress  #333
• Add examples inside the repo style nextjs (with-somelib) #153
• Integrations with Tailwind, MDX and more #67

Exports

• Option to static export (to upload the web to a CDN) #59
• possible to create a desktop app with Tauri , more docs #60
• Support android & ios as output to build .apk and .ipa #108
•  output to node (Node.js) to be more runtime-agnostic #195
• Make Server Build Standalone and Transportable (Bun & Node.js) #447
• Support Vercel Build Output API (v3) #318
• allow hybrid static/dynamic pages/components #40

Next: 1.0 Routemap