Browse Source

refactor: switch to deno

pull/477/head
Dan Ditomaso 1 year ago
parent
commit
db08542b39
  1. 12
      .github/workflows/ci.yml
  2. 14
      .github/workflows/nightly.yml
  3. 14
      .github/workflows/pr.yml
  4. 14
      .github/workflows/release.yml
  5. 3
      .gitignore
  6. 1
      .npmrc
  7. 9
      .vscode/settings.json
  8. 71
      README.md
  9. 27
      biome.json
  10. 6729
      deno.lock
  11. 36
      package.json
  12. 24
      tsconfig.json
  13. 2
      vite.config.ts

12
.github/workflows/ci.yml

@ -16,14 +16,16 @@ jobs:
- name: Checkout code
uses: actions/checkout@v4
- name: Setup bun
uses: oven-sh/setup-bun@v2
- name: Setup Deno
uses: denoland/setup-deno@v2
with:
deno-version: v2.x
- name: Install Dependencies
run: bun install
run: deno install
- name: Run tests
run: bun run test:run
run: deno task test
- name: Build Package
run: bun run build
run: deno task build

14
.github/workflows/nightly.yml

@ -15,20 +15,22 @@ jobs:
- name: Checkout
uses: actions/checkout@v4
- name: Setup bun
uses: oven-sh/setup-bun@v2
- name: Setup Deno
uses: denoland/setup-deno@v2
with:
deno-version: v2.x
- name: Install Dependencies
run: bun install
run: deno install
- name: Run tests
run: bun run test:run
run: deno task test
- name: Build Package
run: bun run build
run: deno task build
- name: Package Output
run: bun run package
run: deno task package
- name: Archive compressed build
uses: actions/upload-artifact@v4

14
.github/workflows/pr.yml

@ -9,20 +9,22 @@ jobs:
- name: Checkout code
uses: actions/checkout@v4
- name: Setup bun
uses: oven-sh/setup-bun@v2
- name: Setup Deno
uses: denoland/setup-deno@v2
with:
deno-version: v2.x
- name: Install Dependencies
run: bun install
run: deno install
- name: Run tests
run: bun run test:run
run: deno task test
- name: Build Package
run: bun run build
run: deno task build
- name: Compress build
run: bun run package
run: deno task package
- name: Archive compressed build
uses: actions/upload-artifact@v4

14
.github/workflows/release.yml

@ -15,20 +15,22 @@ jobs:
- name: Checkout
uses: actions/checkout@v4
- name: Setup bun
uses: oven-sh/setup-bun@v2
- name: Setup Deno
uses: denoland/setup-deno@v2
with:
deno-version: v2.x
- name: Install Dependencies
run: bun install
run: deno install
- name: Run tests
run: bun run test:run
run: deno task test
- name: Build Package
run: bun run build
run: deno task build
- name: Package Output
run: bun run package
run: deno task package
- name: Archive compressed build
uses: actions/upload-artifact@v4

3
.gitignore

@ -2,4 +2,5 @@ dist
node_modules
stats.html
.vercel
dev-dist
.vite/deps
dev-dist

1
.npmrc

@ -1 +0,0 @@
@jsr:registry=https://npm.jsr.io

9
.vscode/settings.json

@ -1,7 +1,6 @@
{
"editor.defaultFormatter": "biomejs.biome",
"editor.codeActionsOnSave": {
"quickfix.biome": "explicit"
},
"editor.formatOnSave": true
"deno.enable": true,
"deno.suggest.imports.autoDiscover": true,
"editor.formatOnSave": true,
"editor.defaultFormatter": "denoland.vscode-deno"
}

71
README.md

@ -9,7 +9,8 @@
## Overview
Official [Meshtastic](https://meshtastic.org) web interface, that can be hosted or served from a node
Official [Meshtastic](https://meshtastic.org) web interface, that can be hosted
or served from a node
**[Hosted version](https://client.meshtastic.org)**
@ -19,7 +20,8 @@ Official [Meshtastic](https://meshtastic.org) web interface, that can be hosted
## Progress Web App Support (PWA)
Meshtastic Web Client now includes Progressive Web App (PWA) functionality, allowing users to:
Meshtastic Web Client now includes Progressive Web App (PWA) functionality,
allowing users to:
- Install the app on desktop and mobile devices
- Access the interface offline
@ -35,8 +37,10 @@ PWA functionality works with both the hosted version and self-hosted instances.
## Self-host
The client can be self hosted using the precompiled container images with an OCI compatible runtime such as [Docker](https://www.docker.com/) or [Podman](https://podman.io/).
The base image used is [Nginx 1.27](https://hub.docker.com/_/nginx)
The client can be self hosted using the precompiled container images with an OCI
compatible runtime such as [Docker](https://www.docker.com/) or
[Podman](https://podman.io/). The base image used is
[Nginx 1.27](https://hub.docker.com/_/nginx)
```bash
# With Docker
@ -46,9 +50,11 @@ docker run -d -p 8080:8080 --restart always --name Meshtastic-Web ghcr.io/meshta
podman run -d -p 8080:8080 --restart always --name Meshtastic-Web ghcr.io/meshtastic/web
```
## Nightly releases
## Nightly releases
Our nightly releases provide the latest development builds with cutting-edge features and fixes. These builds are automatically generated from the latest main branch every night and are available for testing and early adoption.
Our nightly releases provide the latest development builds with cutting-edge
features and fixes. These builds are automatically generated from the latest
main branch every night and are available for testing and early adoption.
```bash
# With Docker
@ -57,38 +63,55 @@ docker run -d -p 8080:8080 --restart always --name Meshtastic-Web ghcr.io/meshta
podman run -d -p 8080:8080 --restart always --name Meshtastic-Web ghcr.io/meshtastic/web:nightly
```
> [!WARNING]
> - Nightly builds represent the latest development state and may contain breaking changes
> - These builds undergo automated testing but may be less stable than tagged release versions
> - Not recommended for production environments unless you are actively testing new features
> [!WARNING]
>
> - Nightly builds represent the latest development state and may contain
> breaking changes
> - These builds undergo automated testing but may be less stable than tagged
> release versions
> - Not recommended for production environments unless you are actively testing
> new features
> - No guarantee of backward compatibility between nightly builds
### Version Information
Each nightly build is tagged with:
- The nightly tag for the latest build
- A specific SHA for build reproducibility
### Feedback
If you encounter any issues with nightly builds, please report them in our [issues tracker](https://github.com/meshtastic/web/issues). Your feedback helps improve the stability of future releases
If you encounter any issues with nightly builds, please report them in our
[issues tracker](https://github.com/meshtastic/web/issues). Your feedback helps
improve the stability of future releases
## Development & Building
You'll need to download the package manager used with this repo. You can install it by visiting [Bun.sh](https://bun.sh/) and following the installation instructions.
### Debugging
You'll need to download the package manager used with this repo. You can install
it by visiting [deno.com](https://deno.com/) and following the installation
instructions listed on the home page.
### Debugging
#### Debugging with React Scan
Meshtastic Web Client has included the library [React Scan](https://github.com/aidenybai/react-scan) to help you identify and resolve render performance issues during development.
React's comparison-by-reference approach to props makes it easy to inadvertently cause unnecessary re-renders, especially with:
Meshtastic Web Client has included the library
[React Scan](https://github.com/aidenybai/react-scan) to help you identify and
resolve render performance issues during development.
React's comparison-by-reference approach to props makes it easy to inadvertently
cause unnecessary re-renders, especially with:
- Inline function callbacks (`onClick={() => handleClick()}`)
- Object literals (`style={{ color: "purple" }}`)
- Array literals (`items={[1, 2, 3]}`)
These are recreated on every render, causing child components to re-render even when nothing has actually changed.
These are recreated on every render, causing child components to re-render even
when nothing has actually changed.
Unlike React DevTools, React Scan specifically focuses on performance optimization by:
Unlike React DevTools, React Scan specifically focuses on performance
optimization by:
- Clearly distinguishing between necessary and unnecessary renders
- Providing render counts for components
@ -96,10 +119,11 @@ Unlike React DevTools, React Scan specifically focuses on performance optimizati
- Offering a dedicated performance debugging experience
#### Usage
When experiencing slow renders, run:
```bash
bun run dev:scan
deno task dev:scan
```
This will allow you to discover the following about your components and pages:
@ -109,20 +133,21 @@ This will allow you to discover the following about your components and pages:
- Expensive hook operations
- Props that change reference on every render
Use these insights to apply targeted optimizations like `React.memo()`, `useCallback()`, or `useMemo()` where they'll have the most impact.
Use these insights to apply targeted optimizations like `React.memo()`,
`useCallback()`, or `useMemo()` where they'll have the most impact.
### Building and Packaging
Build the project:
```bash
bun run build
deno task build
```
GZip the output:
```bash
bun run package
deno task package
```
### Development
@ -130,11 +155,11 @@ bun run package
Install the dependencies.
```bash
bun i
deno i
```
Start the development server:
```bash
bun run dev
deno task dev
```

27
biome.json

@ -1,27 +0,0 @@
{
"$schema": "https://biomejs.dev/schemas/1.7.3/schema.json",
"organizeImports": {
"enabled": true
},
"files": {
"ignoreUnknown": true,
"ignore": ["vercel.json"]
},
"vcs": {
"enabled": true,
"clientKind": "git",
"useIgnoreFile": true,
"defaultBranch": "master"
},
"formatter": {
"enabled": true,
"indentStyle": "space",
"indentWidth": 2
},
"linter": {
"enabled": true,
"rules": {
"recommended": true
}
}
}

6729
deno.lock

File diff suppressed because it is too large

36
package.json

@ -5,29 +5,20 @@
"description": "Meshtastic web client",
"license": "GPL-3.0-only",
"scripts": {
"build": "vite build",
"build:analyze": "BUNDLE_ANALYZE=true vite build",
"check": "biome check src/",
"check:fix": "pnpm check --write src/",
"format": "biome format --write src/",
"dev": "vite dev --open",
"dev:scan": "VITE_DEBUG_SCAN=true vite dev",
"test": "vitest",
"test:ui": "vitest --ui",
"test:run": "vitest run",
"preview": "vite preview",
"package": "gzipper c -i html,js,css,png,ico,svg,webmanifest,txt dist dist/output && tar -cvf dist/build.tar -C ./dist/output/ $(ls ./dist/output/)",
"postinstall": "npx simple-git-hooks"
},
"simple-git-hooks": {
"pre-commit": "bun run check:fix && bun run format"
},
"lint-staged": {
"*.{ts,tsx}": [
"bun run check:fix",
"bun run format"
]
"build": "deno run -A npm:vite build",
"build:analyze": "BUNDLE_ANALYZE=true deno task build",
"lint": "deno lint src/",
"lint:fix": "deno lint --write src/",
"format": "deno fmt --write src/",
"dev": "deno task dev:ui",
"dev:ui": "deno run -A npm:vite dev",
"dev:scan": "VITE_DEBUG_SCAN=true deno task dev:ui",
"test": "deno run vitest",
"test:ui": "deno task test --ui",
"preview": "deno run --allow-net npm:vite preview",
"package": "deno run -A npm:gzipper c -i html,js,css,png,ico,svg,webmanifest,txt dist dist/output && deno run -A --allow-run tar -cvf dist/build.tar -C ./dist/output/ ."
},
"repository": {
"type": "git",
"url": "git+https://github.com/meshtastic/web.git"
@ -79,7 +70,6 @@
"zustand": "5.0.3"
},
"devDependencies": {
"@biomejs/biome": "^1.9.4",
"@tailwindcss/postcss": "^4.0.9",
"@testing-library/react": "^16.2.0",
"@types/chrome": "^0.0.307",

24
tsconfig.json

@ -4,19 +4,24 @@
"target": "ESNext",
"useDefineForClassFields": true,
"lib": ["DOM", "DOM.Iterable", "ESNext"],
"allowJs": false,
"composite": true,
"module": "ESNext",
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"module": "NodeNext",
"moduleResolution": "nodenext",
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"resolveJsonModule": true,
"isolatedModules": true,
"moduleDetection": "force",
"noEmit": true,
"jsx": "react-jsx",
"baseUrl": "./",
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true,
/* Path Aliases */
"paths": {
"@app/*": ["./src/*"],
"@pages/*": ["./src/pages/*"],
@ -34,7 +39,6 @@
"@types/w3c-web-serial"
],
"strictPropertyInitialization": false,
"experimentalDecorators": true,
"allowImportingTsExtensions": true
"experimentalDecorators": true
}
}

2
vite.config.ts

@ -2,7 +2,7 @@ import { defineConfig } from 'vitest/config'
import react from '@vitejs/plugin-react';
import { VitePWA } from 'vite-plugin-pwa';
import { execSync } from 'node:child_process';
import path from 'path';
import path from 'node:path';
let hash = '';
try {

Loading…
Cancel
Save