-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
dcdbb12
commit fa4659f
Showing
8 changed files
with
35 additions
and
30 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,16 +1,14 @@ | ||
| .DS_Store | ||
| node_modules | ||
| build | ||
| static | ||
| *.bun-build | ||
| magick | ||
| /node_modules | ||
| /build | ||
| /static | ||
| /magick | ||
| /target | ||
| /.venv | ||
|
|
||
| # playwright | ||
| playwright-report | ||
| playwright-screenshots | ||
| playwright-traces | ||
| test-results | ||
|
|
||
| # Added by cargo | ||
|
|
||
| /target |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,7 +1,22 @@ | ||
| # Architecture | ||
|
|
||
| This project uses custom architecture I refer to as `entangled atoms` which extends [jōtai](https://jotai.org/) atoms to synchronize state across different [realms](https://262.ecma-international.org/#realm). This allows for end-to-end isomorphic state management where same primitives are used to manage state everywhere. Unconventional nature of this approach led me to design my own boilerplate; after trying out different runtimes I decided to make use of [Bun](https://bun.sh/) which is very fast and offers neat features like macros and programmatically accessible bundler. | ||
| This project uses custom architecture I refer to as `entangled atoms` which extends [jōtai](https://jotai.org/) atoms to synchronize state across different [realms](https://262.ecma-international.org/#realm). This allows for end-to-end isomorphic state management where same primitives are used to manage state everywhere. | ||
|
|
||
| There is no Next.js, Remix, Vite, Webpack or Babel here; my aim is simplicity and minimalism in terms of requirements and general architecture. Currently, boilerplate implements full streaming Server-Side Rendering(SSR) with transparent bundling, hydration and Server-Sent Events(SSE) for state sync. | ||
| # Platform | ||
|
|
||
| There are some disadvatages to this approach. For example, `emotion` uses babel transform to allow referencing other components in styles, which is not possible until I rewrite it as Bun bundler plugin. Assets like images/css are also not implemented yet which breaks `monaco`. | ||
| For this project, I decided to explore what modern frontend project can look like if you discard conventional approach and carefully craft the dependency tree decision by decision. Instead of using Next.js or Remix, I simply implemented streaming Server-Side Rendering (SSR) server and static HTML render. Instead of implementing api routes to exchange information, I used `entangled atoms` which use Server-Sent Events (SSE) to sync state behind the scenes. | ||
|
|
||
| The choice of TypeScript seems natural for an isomorphic crosplatform app, and I picked [Bun](https://bun.sh/) as a runtime and bundler. Not using Babel presents challenges for dependencies that require Babel plugins to work properly, like `emotion` which is used for styling. | ||
|
|
||
| # Jōtai | ||
|
|
||
| In my experience, projects making use of dedicated state management libraries invariably also use hooks given enough time and scope. Impedance mismatch between these two forms may end up inflicting significant story point damage on the project in the long term. Jōtai solves this by offering a drop-in replacement for `useState` so you can easily refactor between them. | ||
|
|
||
| # Principles | ||
|
|
||
| 1. **Less is more.** Going just 20% of the path is fine if it gets the job done. | ||
| 2. **Agile and Lean.** Optimize for flexibility and reduce waste. | ||
| 3. **Isomorphic.** Run exact same code wherever possible. | ||
| 4. **Low level.** Skip unnecessary abstractions and acknowledge the underlying platform. | ||
| 5. **Visually consistent.** System fonts and server side rendering for instant loading and no flickering. | ||
| 6. **Bleeding edge.** To prevent stale dependency hell, dev mode always upgrades dependencies to the latest version. |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,3 +1,3 @@ | ||
| # Tool use debugging | ||
|
|
||
| While Experiment cannot execute actual tools (yet), it is still a massive boon when it comes to debugging them. Add tools by pasting a JSON schema into chat and you will see it visualized in a convenient form with all props sorted first by name, then by depth. Click on the name of the prop to collapse it. You can append multiple tools to chat and they will be available to the model. Tool use completions are also visualized in a similar manner. By default UI uses `markdown` renderer mode, but in some cases switching to `Text + JSON` can be helpful, as in this mode inline JSON is rendered by the same component as tools. | ||
| Although Experiment doesn't execute tools directly at this time, it provides comprehensive debugging capabilities to visualize and manage tool schemas within your chat interactions. Add tools by pasting a JSON schema into chat and creating a message with it by pressing (Enter) and you will see it visualized in a convenient form with all props sorted first by name, then by depth. Click on the name of the prop to collapse it. You can append multiple tools to chat and they will be available to the model. Tool use completions are also visualized in a similar manner. By default UI uses `markdown` renderer mode, but in some cases switching to `Text + JSON` can be helpful, as in this mode inline JSON is rendered by the same component as tools. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters