Makio MeshLine
Makio MeshLine is a TSL‑powered line library for Three.js that delivers fast, easy to customizable thick lines with modern features made by Makio64.
It's built for WebGPURenderer and both Backends (WebGPU & WebGL)
Why a new MeshLine?
Back in 2015s, TheSpite released TheSpite's MeshLine, it opened up new possibilities for thick, styled lines in Three.js, allowing the creation of new effects & explore new horizons.
With Three.js evolving, there was a need for a modern Meshline version that leverages TSL power and improved the core concept.
Makio MeshLine is my vision of it : built to be performant, simple but flexible. It allows creators to focus on ideas rather than implementation details.
Improvements
- Modernize the stack: first‑class TSL nodes and WebGPU pipeline
- Push performance: minimal uploads, smart attributes, large indices
- Instancing out of the box
- Expand flexibility: rich node hooks (position, width, color, opacity, dash), CPU or GPU positions, miter options, gradients, textures, dashes
- Simplify usage: a chainable, ergonomic Fluent API
- Handy helpers (
circlePositions,straightLine, etc.) - Sustain long‑term: ESM‑only, typed, tree‑shakeable
Thanks
A big shout-out to the community, @Floz for constant support, MrDoob for his feedbacks, Sunag for making & improving TSL everyday, Samsyyyy for early feedbacks, to TheSpite for pioneering MeshLine & all my Threejs friends!