gpu-lexer: Een taal-agnostische WebGPU syntax highlighter
import { highlight } from 'gpu-lexer'
const spans = await highlight('source code')
// {
// type: 'plain' | 'comment' | 'string' | 'number' | 'keyword' | 'type' | 'function' | 'constant' | 'operator'
// start: number
// end: number
// }[]
gpu-lexer splitst broncode op in eenvoudige delen: woorden, witruimte, nieuwe regels en symbolen. Vervolgens combineert een compact WebGPU-model lokale en bestandsbrede context om elk deel te labelen. Het is ontworpen voor elke taal: in plaats van een specifieke grammatica te kiezen, schat het model het type van elk onderdeel op basis van de omringende broncode, zelfs als het die taal of syntaxis tijdens de training nooit heeft gezien. De aangrenzende labels vormen de highlight-spans die worden teruggegeven aan de code.
Dit is een experiment, geen highlighter die gelijkwaardig is aan een grammatica-parser. Bij bestanden die buiten de training zijn gehouden, verschillen 12,57% van de token-labels van het huidige model van die van Shiki. Dit meet de overeenstemming met Shiki—niet de objectieve correctheid—en bij onbekende talen of echte code kan dit vaker verschillen.
Voetnoot: ¹ "Taal-agnostisch" betekent één gedeelde tokenizer en classifier, niet een gelijke nauwkeurigheid voor elke taal. 87,43% is het aandeel van de buiten de training gehouden token-labels dat overeenkwam met Shiki. Code in gemengde talen wordt ook ondersteund, inclusief ingebedde <script> en <style> regio's in HTML, Vue en Svelte.
Overeenstemming met Shiki per taal (gebaseerd op buiten training gehouden labels)
- 95–100%: actionscript, angular-html, angular-ts, cython, javascript, jsx, python, tsx
- 90–<95%: apex, astro, c, go, haxe, hlsl, html, kotlin, odin, plist, protobuf, rss, scala, scss, svelte, swift, typescript, xsl
- 80–<90%: bicep, c3, cmake, coffeescript, cpp, csharp, css, d, diff, docker, gdscript, glsl, hcl, java, make, nginx, objective-cpp, php, powershell, qml, rust, shell, shellscript, systemverilog, toml, vala, wgsl
- 70–<80%: ada, asm, bat, fortran-fixed-form, fortran-free-form, groovy, hack, less, lua, matlab, objective-c, perl, puppet, ruby, solidity, vue, xml
- 60–<70%: dart, emacs-lisp, gherkin, julia, markdown, nim, nix, prisma, razor, shaderlab, sql, webassembly
- 50–<60%: awk, graphql, liquid, mdx, r, viml
- <50%: jinja, vb
Model Specificaties
- Trainings-epochs: 4.723.430 tokens
- Model: 41.321 parameters · 31,0 KB packed int6
Opmerking: Elke taal verschijnt in één band; resultaten met minder buiten training gehouden labels zijn minder stabiel. Trainings-tokens bevatten context-only tokens en replay.
Performance Benchmarks
Snelheid: 10x highlighten van three.min.js
Gemeten in 'warmed browser time' (lager is beter).
| Tool | Tijd |
|---|---|
| gpu-lexer | 471.7ms |
| Sugar High | 859.4ms |
| Prism.js | 1.20s |
| Highlight.js | 1.32s |
| Starry Night | 11.1s |
| Shiki | 30.4s |
Testomstandigheden: Eén browser-run na één warm-up op 8 september 2026. De input bestond uit 10 geconcateneerde kopieën van three.min.js (5,56 miljoen tekens). MacBook Pro, Apple M4 Pro, 20-core GPU, 24GB, macOS 26.6.2, Chrome 152. Elke engine draaide in een dedicated worker; DOM-rendering is uitgesloten. gpu-lexer en Shiki leverden token-data, Starry Night leverde een HAST-boom, terwijl Sugar High, Prism.js en Highlight.js highlighted HTML leverden. Versies: Sugar High 2.3.1, Prism.js 1.30.0, Highlight.js 11.12.0, Starry Night 3.11.0, en Shiki 4.4.3.
Bibliotheekgrootte (Loaded library size)
Runtime + geselecteerde taaldekking (lager is beter).
| Tool | Grootte |
|---|---|
| Sugar High (belangrijkste 6 web-talen) | 5.4KB |
| Prism.js (belangrijkste 6 web-talen) | 8.6KB |
| Sugar High (alle 29 talen) | 8.8KB |
| Highlight.js (belangrijkste 6 web-talen) | 14.9KB |
| gpu-lexer (één model) | 27.5KB |
| Prism.js (alle 297 talen) | 162.1KB |
| Starry Night (belangrijkste 6 web-talen) | 185.3KB |
| Shiki (belangrijkste 6 web-talen) | 213.9KB |
| Highlight.js (alle 193 talen) | 240.4KB |
| Shiki (alle 242 grammatica's) | 991.5KB |
| Starry Night (alle 710 grammatica's) | 1.46MB |
Details: Geminificeerde en Brotli-gecomprimeerde browser-bundles gemeten op 8 september 2026. "Belangrijkste web-talen" omvat javascript, typescript, css, html, json en markdown. gpu-lexer gebruikt dezelfde bundle voor elke taal. Totalen van Starry Night zijn inclusief de Oniguruma WASM payload.
Gewogen correctheid (Top 25)
Populariteitsgewogen overeenstemming met Shiki (hoger is beter).
| Tool | Score |
|---|---|
| Shiki | 100% |
| gpu-lexer | 90.20% |
| Prism.js | 87.01% |
| Starry Night | 85.07% |
| Highlight.js | 84.65% |
| Sugar High | 76.33% |
Methodologie: Shiki dient als de 100% normalisatiereferentie. De token-namen van elke bibliotheek zijn gemapt naar dezelfde negen klassen: plain, comment, string, number, keyword, type, function, constant en operator. Scores vergelijken niet-whitespace brononderdelen over 1.069 bestanden die buiten de training zijn gehouden uit de GitHub Innovation Graph top 25 voor 2026-Q1, gewogen naar het aantal 'pushers' per taal. Niet-ondersteunde talen scoren nul; de omvang van het corpus beïnvloedt de wegingen niet.
Ondersteunde Demo-bestanden (75 talen)
De volgende bestanden worden ondersteund in de live demo's: react.development.js, lodash.js, three.min.js, App.jsx, main.jsx, root.tsx, Layout.vue, ModalDemo.vue, VPHero.vue, App.svelte, Counter.svelte, certs.ts, types.ts, bootstrap.css, tailwind-experimental.css, normalize.css, bootstrap.variables.scss, html5-boilerplate.html, react-fixture.html, test.xslt, sessions.py, pydantic.main.py, gin.go, counter.go, tokio.worker.rs, axum.main.rs, ripgrep.main.rs, workerruntime.zig, Assertions.java, Application.kt, Session.swift, AFHTTPSessionManager.m, Model.php, redis.server.c, String.cs, activerecord.base.rb, framework.dart, ERC20.sol, Sort.cu, hello-triangle.shaders.hlsl, godot.canvas.glsl, github.svg, typescript.package.json, checkout.action.yml, ascii.cpp, node.bookworm.Dockerfile, Makefile, cmake.CMakeLists.txt, vpc.main.tf, blog.index.astro, App.tsx, index.tsx, Sudoku.hs, react.README.md, nvm.install.sh, install-powershell.ps1, cornell.raytracer.wgsl, ant-design.button.less, envoy.bootstrap.proto, scipy.messagestream.pyx, kitchen-sink.graphql, uv.pyproject.toml, spark.pi.scala, gradle.accepted-api-changes.groovy, gnome-calculator.vala, qt.list-properties.qml, now-in-android.AndroidManifest.xml, simplepie.feed.rss.xml, react-native.Info.plist, apex-recipes.DynamicSOQLRecipes.cls, c3.std.hashmap.c3, phobos.json.d, basicmapexample.odin, godot.physics-player.gd, nim.json.nim, aspnetcore.ErrorPage.cshtml, flex.ArrayCollection.as, haxe.JsonParser.hx, bicep.comprehensive.bicep, coffeescript.coffee, opentitan.aescore.sv, wasmtime.simd.wat, nginx.conf, calcom.schema.prisma, pygments.test_ada2022.adb, awesome-compose.app.component.html, awesome-compose.app.component.ts, linguist.example.R, VBAllInOne.vb, apacheinit.pp, stockcorr.jl.
***
Disclaimer: Experimentele software. Highlighting is probabilistisch, kan verschillen van Shiki, en is geen parser of vervanging voor een compiler, linter of beveiligingsanalyse.
Groetjes,