Skip to content

Version Packages (next)#849

Merged
techniq merged 1 commit into
nextfrom
changeset-release/next
Apr 29, 2026
Merged

Version Packages (next)#849
techniq merged 1 commit into
nextfrom
changeset-release/next

Conversation

@github-actions
Copy link
Copy Markdown
Contributor

This PR was opened by the Changesets release GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to next, this PR will be updated.

⚠️⚠️⚠️⚠️⚠️⚠️

next is currently in pre mode so this branch has prereleases rather than normal releases. If you want to exit prereleases, run changeset pre exit on next.

⚠️⚠️⚠️⚠️⚠️⚠️

Releases

layerchart@2.0.0-next.61

Minor Changes

  • feat: Per-layer variants for primitives, compound marks, and high-level charts (layerchart/svg, layerchart/canvas, layerchart/html) (#848)

    Layer-agnostic components auto-detect the surrounding <Svg>, <Canvas>, or <Html> layer and bundle every render path. The new sub-path exports expose layer-specific variants so consumers committed to a single rendering layer can opt into a smaller bundle.

    // Default: agnostic, dispatches at runtime — works in any layer
    import { Rect, Circle, Text, Path, LineChart } from 'layerchart';
    
    // SVG-only — skips canvas + html branches
    import { Rect, Circle, Text, Path, LineChart } from 'layerchart/svg';
    
    // Canvas-only
    import { Rect, Circle, Text, LineChart } from 'layerchart/canvas';
    
    // HTML-only — drops canvas + svg overhead (some primitives are ~95% smaller)
    import { Rect, Circle, Text, Pattern, LinearGradient } from 'layerchart/html';

    Each agnostic component (e.g. Rect.svelte) now dispatches to the corresponding per-layer variant under the hood (Rect.svg.svelte, Rect.canvas.svelte, Rect.html.svelte) — no breaking change for existing consumers.

    What's split

    Primitives (13) — the basic graphics building blocks
    Circle, Text, Rect, Line, Path, Ellipse, Polygon, Group, Image, ClipPath, Pattern, LinearGradient, RadialGradient

    Compound marks (~30) — chart axes, marks, annotations, and chart-relative shapes
    Axis, Grid, Rule, Highlight, Layer, ChartChildren, ChartClipPath, CircleClipPath, Bars, Bar, Spline, Area, Pie, Arc, ArcLabel, Points, Cell, Frame, Threshold, Trail, Vector, Link, Labels, AnnotationLine, AnnotationPoint, AnnotationRange, Hull, Density, Voronoi, Contour, Raster, Violin, BoxPlot, Calendar, Month

    Geo components (layerchart/geo)
    GeoPath, GeoSpline, GeoPoint, GeoCircle, GeoTile, TileImage, Graticule, GeoClipPath, GeoEdgeFade

    Graph components (layerchart/graph)
    Ribbon

    High-level chart wrappers — pre-composed charts with built-in tooltips, highlights, and series handling
    LineChart, AreaChart, BarChart, ScatterChart, PieChart, ArcChart

    The geo, graph, hierarchy, and force sub-paths also re-export every layer-agnostic helper they previously included, so a single from 'layerchart/svg' import covers a typical SVG chart end-to-end without falling back to 'layerchart'.

    Standout per-layer wins (gz, vs agnostic baseline)

    Primitives where the per-layer rendering is dramatically simpler:

    • Pattern html: 14.81 → 0.92 KB (-94%) — HTML implementation is just CSS-string generation
    • LinearGradient html: 14.38 → 0.53 KB (-96%)
    • Image canvas: 14.95 → 3.73 KB (-75%)
    • Text svg/html: 29.13 → ~16 KB (-45%)
    • Circle / Rect / Ellipse / Line / Path: ~22–27% smaller per-layer

    Compound marks: typically 8–15% gz savings per-layer; outliers like Highlight (-30% canvas) and Cell (-22% svg) are larger because their HTML/canvas vs. SVG paths diverge significantly.

    High-level charts: ~5–12% gz savings (~5–11 KB) when imported from layerchart/svg or layerchart/canvas. A single-layer LineChart drops from 89.6 KB → 79.0 KB gz on the SVG path.

    For a consumer who migrates all imports to a single layer, cumulative savings across primitives and compound marks are 60–80 KB gz.

    Bundle reductions on the default <Chart> path

    In addition to opt-in per-layer variants, this release also makes a few previously-eager features lazy:

    • <TransformContext> is now dynamically imported when <Chart transform={...}> is set — saves ~2.8 KB gz on every chart that doesn't pan/zoom.
    • <BrushContext> was already lazy; nothing changes there.

    <ChartCore> for non-cartesian charts (new)

    A new <ChartCore> component is exported alongside <Chart> from each layer sub-path (layerchart, layerchart/svg, layerchart/canvas, layerchart/html). It provides the chart context, sizing, brush, transform, and tooltip plumbing — but skips <ChartChildren> and the Layer / Axis / Grid / Rule / Highlight / ChartClipPath import chain it pulls in.

    Use it for geo maps, custom layouts, or any chart that renders its own primitives directly via the children snippet:

    <script>
      import { ChartCore, Svg, GeoProjection, GeoPath } from 'layerchart/svg';
    </script>
    
    <ChartCore data={countries}>
      {#snippet children({ context })}
        <Svg>
          <GeoProjection projection={geoMercator} fitGeojson={countries}>
            <GeoPath geojson={countries} fill="steelblue" />
          </GeoProjection>
        </Svg>
      {/snippet}
    </ChartCore>

    Measured savings (bundle scenarios):

    • base (<Chart>) → core (<ChartCore>): 83.42 → 50.93 KB gz (−39%)
    • geo (<Chart> + GeoPath/GeoPoint) → core-geo (<ChartCore> + GeoProjection + GeoPath): 87.23 → 54.67 KB gz (−37%)
    • base-svg (per-layer) → core-svg (per-layer): 77.37 → 50.88 KB gz (−34%)

    Behavior

    Identical to the agnostic versions: visual output, props, types, and bindable refs all match. The dispatcher pattern adds ~0.2 KB per primitive to core for users on the agnostic API (transitive cost from Highlight / Axis / Chart) — a worthwhile tradeoff for the opt-in per-layer savings.

    See the updated "Bundle Size" guide for the full table, tradeoffs, and when to opt into per-layer imports.

@github-actions github-actions Bot force-pushed the changeset-release/next branch from c7b3329 to be0bd53 Compare April 29, 2026 18:37
@techniq techniq merged commit 04ae35a into next Apr 29, 2026
@techniq techniq deleted the changeset-release/next branch April 29, 2026 18:42
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant