Skip to content

Commit

Permalink
docs: Update browser support documentation and improve formatting in …
Browse files Browse the repository at this point in the history
…BROWSERS.md and README.md
  • Loading branch information
wouterlucas committed Nov 28, 2024
1 parent 2b3a866 commit 2f1784d
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 20 deletions.
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 |
| | | |

0 comments on commit 2f1784d

Please sign in to comment.