Skip to content

Feature: Icon tree-shaking for @pierre/trees #864

Description

@Turbo87

Prerequisites

Proposal

I noticed that the built-in icon sets in @pierre/trees don't seem to be tree-shakeable. Even with set: 'none' and my own spriteSheet, all three still end up in the bundle.

In my case I'd like to use the catppuccin/vscode-icons set, so I passed my own sprite and set: 'none'. But the built-in standard and complete SVGs ship anyway, so I'm bundling two icon sets when only one ever shows up.

From what I can tell, FileTree calls getBuiltInSpriteSheet(set) unconditionally against an object that eagerly references all three tiers. Since set is a runtime value, nothing is ever statically dead, so bundlers just keep all of it.

I measured it with esbuild on a set: 'none' entry and all 53 file-tree-builtin-* symbols end up in the output. Dropping just the sym_* constants shrinks the bundle by about 34.5 KB raw and 12 KB gzipped.

Would it be viable to split the tiers into separate modules and ship the non-minimal ones as importable values?

import { complete } from '@pierre/trees/icons'
new FileTree({ icons: complete })

Unfortunately, that would shift the default from complete to minimal, with the colored set as an explicit opt-in, but I'm not sure how else to achieve this in a bundler-friendly way. Totally open to other ideas if there's a better way, and happy to help with a PR! :)

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions