JointJS

What if your Claude Code Playground diagrams were actually interactive? Draggable nodes. Smart link routing. Animated transitions. One HTML file, no build steps. Here's how to do it with the open source version of JointJS 👉 youtube.com/watch?v=GSYSbJ… #claudecode #diagramming #javascript #webdev

Can your diagramming library handle 100,000 elements and still feel this smooth and performant? 💨 We put JointJS to the test to see whether it could turn a massive diagram into a performance masterpiece. See it in action below. 👇 #WebPerformance #JointJS #TechTips

Wonder how JointJS performs with massive diagrams and workflows? Here's a written overview on our blog, testing diagrams with 100,000 nodes. 🚀 jointjs.com/blog/jointjs-p…

JointJS performance overview: youtu.be/vMLLgK7Lb2g

Can a JavaScript diagramming library render 100,000 elements on a single canvas without dropping frames? Short answer: Yes. Long answer: We tested it. From 600 nodes to 100,000, with and without performance optimizations applied, recording everything in the DevTools Performance tab. The video covers: 🚀 How JointJS holds up at 600, 1,000, 6,000, 11,000, and 100,000 nodes ⚡️ The five techniques that make the biggest difference at scale 🤖 How to get specific, doc-backed performance advice with the JointJS MCP server If you're evaluating diagramming libraries and care about performance, this one's worth a watch. Link in the comments. #JointJS #DataVisualization #Diagramming

Try the YouTube Channel Visualizer: cssw.io/youtube-channe…

Want a clearer view of your YouTube channel performance? With our YouTube Channel Visualizer, you can: 🚀 map your channel as an interactive diagram 📊 spot key metrics that help you make better content decisions 🎆 export a visual snapshot to share with your team or audience Watch the short video to see how it works. #YouTube #ContentStrategy #DataVisualization #CreatorTools #Analytics

🎬 From JointJS demo to working apps — in minutes, with Claude Code 1/ Pick a JointJS demo app close to your use case. 2/ Tell Claude Code what to change. 3/ Have a working prototype before your next meeting. In our latest tutorial, Zoran walks through customizing our AI workflow builder demo — branding, UI tweaks, new workflow actions, SVG export — without deep JointJS knowledge. We have 180+ demos to start from. The rest is just prompting. Watch the full tutorial: youtube.com/watch?v=5A2ktO… #JointJS #ClaudeCode #Diagramming #AI

Do long links make your complex diagrams hard to read? 😵‍💫 As diagrams grow, connections start crossing the entire canvas, overlapping elements and adding visual noise. ✅ In our new demo, we solve this with link teleports. Long links are replaced with small markers at each end. Click a marker and the viewport jumps to the connected shape. Short links stay visible. Long ones switch automatically. Cleaner canvas. Same connectivity. Play with teleport links here: jointjs.com/demos/link-tel… #JointJS #diagramming

itemis DE uses JointJS to power a visual statechart editor in itemis CREATE, enabling teams to model, simulate, and validate complex state-based system behavior. ➡️ jointjs.com/showcase/itemis -- See more real-world products built with JointJS 👉 jointjs.com/showcase #CustomerShowcase #itemis #JointJS #Diagramming #StatechartEditor #StateMachine

Big news for JointJS 🚀 We’re excited to welcome @ZoranJambor as our new Developer Advocate. Many of you may already know Zoran as the person behind @CSSWeekly — a developer newsletter with 40,000+ subscribers — and a YouTube channel followed by 13k+ developers. For years, he’s been curating, explaining, and breaking down complex frontend topics for a global audience. Now, he’s bringing that experience to JointJS. Zoran will help us double down on: 😎 clearer technical content 👌 better demo apps 📄 deeper tutorials ❤️ stronger connection with the dev community JointJS has always been built for developers solving complex diagramming problems. With Zoran onboard, we’re investing even more into education, hands-on examples, and real-world use cases. If you're building workflow editors, BPMN modelers, data modeling tools, network visualizations, or any serious diagram UI — you’ll be seeing a lot more practical content from us soon. Welcome to the team, Zoran 👋

Curious how it’s built? Read the full tutorial: jointjs.com/blog/build-gen…

👫 We’ve just released a new Genogram (family tree) demo. Turn structured family data into a clean, interactive, multi-generational diagram — automatically. No manual positioning. No layout headaches. If your app works with relationship or hierarchical data, this shows how to visualize it clearly and instantly. 👉 Explore the live demo: jointjs.com/demos/genogram… Full tutorial linked below. #genogram #familytree #diagramming #jointjs

Have you ever wondered how to render Angular components inside JointJS shapes? Our latest tutorial shows how to do this with Angular’s native createComponent() API — no migration or workarounds required. What you get: ✅ Reuse existing components ✅ Stay in the Angular ecosystem ✅ Full two-way binding ✅ Complete lifecycle management Perfect for teams that: 1️⃣ Have existing Angular components they need to visualize in diagrams 2️⃣ Want to build diagramming features without stepping outside Angular's patterns 3️⃣ Need interactive diagram elements with forms, inputs, or complex UI 🔗 Get started: Follow the complete step-by-step tutorial: docs.jointjs.com/learn/integrat…

👉 Our new GitHub repository with all demo apps: github.com/clientIO/joint…

The source code of aaaaaall our 180+ demo apps is now on GitHub! 🚀 Plus, we’ve updated the demo pages to improve how you browse, test, and reuse them. Now you can: 1️⃣ Pick the demo closest to your use case 2️⃣ Explore it in full-screen mode 3️⃣ Jump straight to the source code 4️⃣ Install it locally via NPM 5️⃣ Adapt it to your own product Pair this with tools like Claude Code, and you can go from idea → prototype → production in record time. What a time to be a diagrammer! 😎

JointJS+ now ships via NPM! 📦 We’ve upgraded our distribution model to align with how modern engineering teams build and ship software. ❌ No more manual ZIP workflows (unless you prefer them — they remain available). ✅ Install via NPM and start building immediately. Why this matters: • Controlled, predictable upgrades via your package manager • Dependency management • CI/CD friendly setup • Faster onboarding for new developers • Cleaner integration into modern frameworks 👉 Who this applies to: 1️⃣ JointJS+ customers with an active update subscription → You already have access. Instructions are available in the customer portal: my.jointjs.com 2️⃣ Customers with an expired update subscription → Reach out to reactivate updates and access the NPM packages: jointjs.com/contact-us 3️⃣ Trial users → All new trials now use the NPM-based setup by default: jointjs.com/free-trial This change removes friction, simplifies maintenance, and makes JointJS+ feel native inside modern JavaScript stacks. #npm

Built this interactive Claude evolution timeline in minutes 👇 changelog.jointjs.com/gallery/timeli… All I ran: npx @joint/cli download timeline/ts claude “update demo to show Claude models + release dates” Interactive. Editable. Power of @jointjs . 🚀 #javascript #Claude #jointjs

Did you know? 👀 @splunk – company acquired by @Cisco – relies on JointJS as a foundation for their complex and widely used SOAR system. This visual orchestration and automation system helps leading companies such as @Siemens streamline security operations, making these companies more resilient. ➡️ jointjs.com/showcase/splunk -- See more real-world products built with JointJS 👉 jointjs.com/showcase

Did you know? 👀 GearConnect Entertainment Software leverages JointJS to transform system drawings for the live event and entertainment industries. The platform replaces manual AV system diagramming with a data-driven workflow that includes built-in validation, reporting, and collaboration capabilities. Key features: ✔️ 1,600+ gear items in the library ✔️ Automatic link routing ✔️ Real-time validation ✔️ High performance with large diagrams ✔️ Export to JPG, SVG, CSV, and Excel -- See more real-world products built with JointJS 👉 jointjs.com/showcase #diagramming #customershowcase