Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update README.md & BROWSERS.md #461

Merged
merged 1 commit into from
Nov 28, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 14 additions & 13 deletions BROWSERS.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,17 +24,18 @@ Below is a detailed breakdown of confirmed browsers that work with LightningJS,
| | v54 | Enables resizing in `createImageBitmap`. |
| | v63 | Adds support for dynamic imports. |
| | v71 | Introduces `globalThis`. |
| **QtWebKit** | 5.2 | Support for WebGL1, with known issues |
| **WPEWebKit** | 2017 | Adds support for Image Worker and `createImageBitmap`. |
| | 2.22 | Full support, including Lightning Native mode (disables DOM/CSS compositing except for `<canvas>`, `<video>`, `<audio>` tags). |
| | 2.28 | Full support. |
| | 2.36 | Adds offscreen canvas and shared array buffers with await support for multithreading. |
| | 2.46 | (Upcoming) Adds FTL support for 32-bit devices and offscreen rendering support for Lightning Native. |

For createImageBitmap the Lightning 3 renderer will use a 1x1 PNG Pixel to validate whether the createImageBitmap API is available and which version can be used.
For createImageBitmap the Lightning 3 renderer will use a `1x1` PNG Pixel to validate whether the createImageBitmap API is available and which version can be used.
If the createImageBitmap API is not available it will gracefully fallback to `new Image()` with a performance decrease.

Lightning 3 prefers to run on **WPEWebKit** with `Lightning Native` (also known as nonCompositedWebGL) enabled for maximum performance!
For more information please see (https://wpewebkit.org/)[https://wpewebkit.org/]
For more information please see [https://wpewebkit.org/](https://wpewebkit.org/)

## Running Lightning in older Browsers

Expand All @@ -50,32 +51,32 @@ pnpm i -D @vitejs/plugin-legacy whatwg-fetch

### Configuration

Add the following to your \`vite.config.js\`:
Add the following to your `vite.config.js`:

```javascript
import legacy from '@vitejs/plugin-legacy';

export default {
plugins: [
legacy({
targets: ['chrome>=38'],
modernPolyfills: true,
additionalLegacyPolyfills: ['whatwg-fetch'],
}),
],
plugins: [
legacy({
targets: ['chrome>=38'],
modernPolyfills: true,
additionalLegacyPolyfills: ['whatwg-fetch'],
}),
],
};
```

### Adjusting Targets

Modify the \`chrome>=38\` target to match the browser version you need to support. If the target version is **Chrome v71** or higher, or **WPEWebKit 2.22** or newer, the legacy plugin is not required. You can adjust the target in your build configuration:
Modify the `chrome>=38` target to match the browser version you need to support. If the target version is **Chrome v71** or higher, or **WPEWebKit 2.22** or newer, the legacy plugin is not required. You can adjust the target in your build configuration:

```javascript
build: {
target: prodTarget,
target: prodTarget,
},
esbuild: {
target: devTarget,
target: devTarget,
},
```

Expand Down
10 changes: 3 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,7 @@
A powerful 2D scene renderer designed for rendering highly performant user
interfaces on web browsers running on embedded devices using WebGL.

The Renderer is not designed for direct application development but instead
to provide a lightweight API for front-end application frameworks like Bolt and
Solid.
The Renderer is part of the [LightningJS](https://lightningjs.io) project. While it is possible to use the renderer directly, it is not recommended. Instead, Lightning 3 works best when combined with [Blits](https://lightningjs.io/v3-docs/blits/getting_started/intro.html).

## Setup & Commands

Expand Down Expand Up @@ -45,7 +43,7 @@ The Lightning 3 Renderer's goal is to work with the following browser versions a

Any JavaScript language features or browser APIs that cannot be automatically transpiled or polyfilled by industry standard transpilers (such as Babel) to target these versions must be carefully considered before use.

For a more detailed and comprehensive list of browsers and their features please see [browsers](./BROWSERS.md)
For a more detailed and comprehensive list of browsers and their features please see [browsers](./BROWSERS.md).

## Example Tests

Expand All @@ -61,8 +59,7 @@ The Example Tests can be launched with:
pnpm start
```

A hosted version can be found at:
(https://https://lightning-js.github.io/renderer/)[https://lightning-js.github.io/renderer/]
A hosted version can be found [here](https://lightning-js.github.io/renderer/).

This supports modern browsers as well as Chrome 38 and above through a legacy build.

Expand Down Expand Up @@ -148,4 +145,3 @@ Canvas renderer only supports Web Fonts:
| ------------------ | -------- | -------- |
| WebGL | Y | Y |
| Canvas | N | Y |
| | | |