⚡ This new version improves tree-shaking for EdgeStyle and Perimeter, updates the documentation, and fixes bugs. ⚡

Resources

• npm package: @maxgraph/core 0.19.0
• Fixed issues: milestone 0.19.0
• Documentation: maxgraph_0.19.0_website.zip
• Examples: maxgraph_0.19.0_examples.zip
• Changelog (only includes a summary and breaking changes): changelog

Breaking changes

• EdgeStyle is now a namespace
  It used to be a class with static properties. You could technically mutate it to add or override values — but that’s no longer possible.
  If you were doing this, you now need to define your own EdgeStyle implementation and register it explicitly.

• Perimeter is now a namespace
  Previously a plain object, Perimeter could be mutated too. Not anymore.
  Like with EdgeStyle, create your own perimeter implementation and register it if needed.

Highlights

📦 Tree-shaking improvements for EdgeStyle and Perimeter

Until now, all edge styles and perimeters were bundled into your app even if you only used a few of them. Why? Because EdgeStyle and Perimeter were objects that referenced everything, which prevented bundlers from optimizing properly.

Here’s what changed:

• EdgeStyle is now a namespace. This allows bundlers to drop unused edge styles and only keep what’s actually registered and used via StyleRegistry.
• Perimeter is now also a namespace, instead of a value object. This improves bundling behavior, especially for bundlers that couldn’t previously optimize it (Webpack, Vite when misconfigured, etc.).

📉 Impact on bundle size

Depending on what edge styles and perimeters your app uses, and the bundler you're using, bundle size can shrink by 1 to 5 kB.

🔍 A few things to keep in mind

• The EdgeStyle change currently has limited effect, since many built-in styles are still referenced directly in the codebase. This will improve in the future (see #767).
• The Perimeter change doesn’t impact apps built with Rollup or Vite (which uses Rollup internally), since they already optimized this before. But it’s now cleaner and safer across the board.

Here’s a concrete example of what Rollup was doing with the old object-based Perimeter (with minification disabled):

const RectanglePerimeter = ...
const EllipsePerimeter = ...

const Perimeter = {
  RectanglePerimeter,
  EllipsePerimeter
};

Only the perimeters actually used are bundled in.

🔬 Real-world examples from the maxGraph repo

Analysis:

• In the *-without-default examples, there's no change — because Perimeter wasn't used.
• In TS examples, the gains are minor (Rollup already tree-shaked well).
• The best gains are seen in JS/Webpack examples where tree-shaking was previously limited.

🔬 Examples from the maxgraph-integration-examples repository

• Related PR: #220

What's Changed

🎉 New Features

• feat!: improve tree-shaking of Perimeter by @tbouffard in feat!: improve tree-shaking of Perimeter #785
• feat: improve IDE guidance for style element registration by @tbouffard in feat: improve IDE guidance for style element registration #787
• feat!: improve tree-shaking of EdgeStyle by @tbouffard in feat!: improve tree-shaking of EdgeStyle #791

🐛 Bug Fixes

• fix: correctly convert "arc" attributes to boolean in StencilShape by @tbouffard in fix: correctly convert "arc" attributes to boolean in StencilShape #788

📝 Documentation

• docs: add structure section and improve npm package details by @tbouffard in docs: add structure section and improve npm package details #792

⚙️ Refactor

Full Changelog: v0.18.0...v0.19.0