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).

ToolTijd
gpu-lexer471.7ms
Sugar High859.4ms
Prism.js1.20s
Highlight.js1.32s
Starry Night11.1s
Shiki30.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).

ToolGrootte
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).

ToolScore
Shiki100%
gpu-lexer90.20%
Prism.js87.01%
Starry Night85.07%
Highlight.js84.65%
Sugar High76.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.