
@vuejs core team member • Volar.js author - Supported by @stackblitz • Coffee Freedom Achiever
Joined August 2018
- Tweets3.2K
- Following421
- Followers6.5K
- Likes4.5K
The crazy part is that replacing magic-string with muggle-string noticeably improved the Vue compiler’s performance, memory use, and source map accuracy.
github.com/vuejs/core/pull/1…
🎉 muggle-string 1.0 is out! It's the string rewriting library behind vuejs/language-tools, redesigned for the Content Mapper use case.
github.com/johnsoncodehk/mug…
Thanks to content mappers, Volar.js v3 can drop about 40% of the v2 codebase (~8.7k LOC).
Replying to @nullvoxpopuli
I find that a diagram makes it clearer. Simply put, I think Ember no longer needs Volar.js now!
Vue Language Tools v4 alpha is out.
TypeScript 7's own tsc now type-checks .vue files via @vue/content-mapper, no more vue-tsc.
* Editor support isn't ready yet.
github.com/vuejs/language-to…
Firing the left and right thrusters back and forth like that seems wasteful, but we can always do better.
It's wild to see something that used to only show up in movies or games happen in real life. Honestly, that hits harder for me than AGI.
4
1,828
StackBlitz/Bolt has been supporting my work, with no strings attached. 🙏
More than thanking them, I want to point out a fact: without their support for my full-time work on Volar, we could never have shipped Volar v3. That work fed into what became TS 7.1 Content Mappers, and helped improve the developer experience across the frontend ecosystem in a deeper way.
I've been a bit quiet lately, but I haven't been resting. I might have something interesting to show you soon. 🤞
Replying to @asleMammadam
volar is the language tooling behind the official vue editor extension and vue-tsc. we sponsor @johnsoncodehk at $1,000/month.
Besides my generous sponsors, I'm mainly funded by @evanyou's Vue Source Inc. fund program. It lets me maintain Vue language tools full-time while still exploring new ideas!
1
3
432
I previously said Volar and tsslint would never get another major version bump, but thanks to TS 7.1's Content Mappers, we'll have to release:
* Volar.js v3
* Vue Language Tools v4
* tsslint v4
How bad is my English? I can spell "reproduction," not because I remember how it's spelled, but because my fingers remember the typing sequence for each letter.
3
7
1,045
Just dropped TNB into vuejs/language-tools.
vue-tsc → 2.7x faster
tsslint → 2x faster
Introducing typescript-native-bridge. Native TS performance in the tools you already use.
Dropped in one package override, and vue-tsc got ~3.3× faster while using 45% less memory. Works with astro-check, svelte-check, glint, tsslint, tsserver, @mdx-js/typescript-plugin. No new CLI or LSP needed.
github.com/johnsoncodehk/typ…
Introducing typescript-native-bridge. Native TS performance in the tools you already use.
Dropped in one package override, and vue-tsc got ~3.3× faster while using 45% less memory. Works with astro-check, svelte-check, glint, tsslint, tsserver, @mdx-js/typescript-plugin. No new CLI or LSP needed.
github.com/johnsoncodehk/typ…
Goodbye Claude 👋 But thank you for letting me try.
Replying to @mat4m0
It's not available for subscription in my region, but I can use Claude because I applied for Anthropic's OSS program.
These past few months, I've been thinking about my role in OSS in the age of AI.
AI amplifies a good developer's output by 10x — but in the hands of a bad developer, it's the AI's hallucinations that get amplified by 10x. Solid programming skills and taste remain essential — and a good developer's attention is a precious asset in itself.
Since coding ability and time are no longer the main bottlenecks, I believe we should channel these strengths — with the help of AI — into solving the problems that have gone unsolved simply because they aren't "fun," but that can still genuinely make the world a little better.
If we get this right, I think the OSS community could shift from being bottlenecked by manpower to being bottlenecked only by courage and care.
When I created Volar, I completely rewrote Vue’s TextMate from scratch, but I still felt I knew nothing about TextMate.
Fortunately, handwriting TextMate will soon be history. 🤞
Replying to @johnsoncodehk
How? We stopped hand-writing the highlighter.
Monogram defines a language's grammar once as a parser, proves it against tsc's conformance suite, then derives the TextMate / tree-sitter / Monarch highlighters from that proven model.
github.com/johnsoncodehk/mon…
Since this is a completely new replacement, we still need some time to ensure all edge cases are resolved.
With the help of AI, we no longer have the excuse of shipping a half-baked product due to a lack of manpower. I’ll do my best to get it right the first time.
Vue’s syntax highlighting will be perfect!
I still find the topic of AI very boring. Because AI has taken away the interesting parts of my work, I've become a boring person. :p
My CLAUDE.md has just 2 rules to fix Claude Opus's behavior — it basically distills my working style. Feel free to copy it if you want.
gist.github.com/johnsoncodeh…
How? We stopped hand-writing the highlighter.
Monogram defines a language's grammar once as a parser, proves it against tsc's conformance suite, then derives the TextMate / tree-sitter / Monarch highlighters from that proven model.
github.com/johnsoncodehk/mon…
This is a huge encouragement—thank you so much!!
/
📢お知らせ
\
株式会社メイツ エンジニアリングチームから,Vue.js Language Tools で多大な貢献をされている @johnsoncodehk , @KazariEX_0929 にそれぞれ $400 のワンショットスポンサーを行いました!
彼らの活動に感謝します!
OSS にスポンサーする企業が便乗して増えてくれると嬉しい!
alien-signals v3.2.0
- Effect cleanup functions
- 4 propagation bug fixes
github.com/stackblitz/alien-…
Also built reactive-framework-test-suite — 180 test cases for reactive signal semantics across 13 libraries. PRs welcome to add more frameworks or test cases.
github.com/johnsoncodehk/rea…














