partme-ai/threejs-node-tsl
skills/threejs-skills/threejs-node-tsl/SKILL.md
three.js node-based shading: Nodes API surface, NodeMaterial and MeshStandardNodeMaterial-style families, TSL (Three.js Shading Language) entry at TSL.html, WebGPURenderer pairing, and core PostProcessing (class) versus addon EffectComposer at a high level. Use when authoring shaders as graphs, using TSL builtins, compute-oriented nodes, or modern WebGPU pipelines; for classic ShaderMaterial GLSL use threejs-materials; for stock EffectComposer passes use threejs-postprocessing; for WebGLRenderer-only tuning use threejs-renderers.
$ install --global
skillsauthnpx skillsauth add partme-ai/full-stack-skills threejs-node-tslInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Jun 4, 2026, 7:48 AM122.3s4 files scanned
SKILL.md
- name:
- threejs-node-tsl
- description:
- three.js node-based shading: Nodes API surface, NodeMaterial and MeshStandardNodeMaterial-style families, TSL (Three.js Shading Language) entry at TSL.html, WebGPURenderer pairing, and core PostProcessing (class) versus addon EffectComposer at a high level. Use when authoring shaders as graphs, using TSL builtins, compute-oriented nodes, or modern WebGPU pipelines; for classic ShaderMaterial GLSL use threejs-materials; for stock EffectComposer passes use threejs-postprocessing; for WebGLRenderer-only tuning use threejs-renderers.
When to use this skill
ALWAYS use this skill when the user mentions:
NodeMaterial,TSL, imports fromthree/nodesor WebGPU entry points in docs- Building materials or post effects from nodes instead of string GLSL
WebGPURenderer,PostProcessing(core class) in a node-centric pipeline
IMPORTANT: node-tsl vs materials vs postprocessing
| Situation | Skill |
|-----------|--------|
| Standard PBR tuning, no nodes | threejs-materials |
| TSL graph, NodeMaterial, WGSL path | threejs-node-tsl |
| Classic EffectComposer + Pass classes | threejs-postprocessing |
| Node post passes listed under Addons TSL in docs | threejs-node-tsl + threejs-postprocessing awareness |
Trigger phrases include:
- "TSL", "NodeMaterial", "three/nodes", "WebGPU", "node builder"
- "节点材质", "着色语言 TSL"
How to use this skill
- Decide path: WebGPU + nodes vs WebGL + classic materials—do not hybridize blindly.
- Anchor docs: start from Nodes index and TSL.html; use NodeMaterial for material entry.
- Progressive disclosure: keep SKILL.md navigational; long symbol lists live in references/official-links.md and references/tsl-vs-classic.md; see examples/workflow-tsl-entry.md for navigation habits.
- Renderer: enable
WebGPURendererper docs; fall back notes belong in threejs-renderers. - Debugging: use version-stamped examples in three.js repo; avoid copying deprecated import paths.
- Post stack: if user names
PostProcessingcore class vs addon composer, clarify table in threejs-renderers / threejs-postprocessing.
Doc map (official)
| Docs section | Representative links | |--------------|----------------------| | Nodes | https://threejs.org/docs/#Nodes | | TSL | https://threejs.org/docs/TSL.html | | NodeMaterial | https://threejs.org/docs/NodeMaterial.html | | WebGPU renderer | https://threejs.org/docs/WebGPURenderer.html |
Scope
- In scope: Nodes/TSL discovery, architecture, renderer pairing, where to look next, migration hints from ShaderMaterial.
- Out of scope: Pasting entire TSL symbol tables into SKILL.md; guaranteeing API stability across rapid releases—always cite "current docs".
Common pitfalls and best practices
- Three.js node APIs evolve quickly—tie answers to a version or "current docs".
- Do not confuse core
PostProcessingclass with addonsEffectComposer—names collide in conversation. - WGSL vs GLSL expectations differ; TSL abstracts but limits still apply.
- Keep graphs modular; use references for lookup instead of bloating agent context.
Documentation and version
The Nodes index and TSL page are large and fast-moving. Treat https://threejs.org/docs/ as the source of truth for the user’s installed three.js; prefer linking NodeMaterial and WebGPURenderer over paraphrasing long symbol lists.
Agent response checklist
When answering under this skill, prefer responses that:
- Anchor on TSL.html and/or
#Nodesrather than inventing API names. - Contrast threejs-materials (classic) vs node/TSL path explicitly.
- Warn that WebGPU + nodes examples may require recent minors—cite version when known.
- Point to references/tsl-vs-classic.md and references/official-links.md for long lookups.
- Disambiguate core
PostProcessingvs addonEffectComposer(threejs-postprocessing).
References
- https://threejs.org/docs/#Nodes
- https://threejs.org/docs/TSL.html
- https://threejs.org/docs/NodeMaterial.html
- https://threejs.org/docs/WebGPURenderer.html
Keywords
English: tsl, node material, nodes, webgpu, wgsl, three.js shading language, node builder, nodematerial
中文： TSL、节点材质、WebGPU、着色语言、NodeMaterial、three.js
Related Skills
partme-ai/uniapp-project
development
VerifiedTrustedCommunity
Provides per-component and per-API examples with cross-platform compatibility details for uni-app, covering built-in components, uni-ui components, and APIs (network, storage, device, UI, navigation, media). Use when the user needs official uni-app components or APIs, wants per-component examples with doc links, or needs platform compatibility checks.
456SKILL.mdUpdated Jun 4, 2026
partme-ai/uniapp-project-creator
tools
VerifiedTrustedCommunity
Creates new uni-app projects via the official CLI or HBuilderX with Vue 2/Vue 3 template selection, manifest.json and pages.json configuration, and directory structure setup. Use when the user wants to scaffold a new uni-app project, initialize project files with a single command, or set up the development environment.
456SKILL.mdUpdated Jun 4, 2026
partme-ai/uniapp-plugin
tools
VerifiedTrustedCommunity
Browses, installs, configures, and manages plugins from the uni-app plugin market (ext.dcloud.net.cn) including component plugins, API plugins, and template plugins with dependency handling. Use when the user needs to find and install uni-app plugins, configure plugin settings, manage plugin dependencies, or integrate third-party components.
456SKILL.mdUpdated Jun 4, 2026
partme-ai/uniapp-native-plugin
tools
VerifiedTrustedCommunity
Develops native Android and iOS plugins for uni-app including module creation, JavaScript-to-native communication, and plugin packaging for distribution. Use when the user needs to build custom native modules, extend uni-app with native capabilities (camera, Bluetooth, sensors), or create publishable native plugins.
456SKILL.mdUpdated Jun 4, 2026