search

Templarian / MaterialDesign-JS

Dist for Material Design Icons JS/TypeScript
Other
156 stars 18 forks source link

Create separate icon files #4

Closed smeijer closed 4 years ago

smeijer commented 4 years ago

Is it an idea to create separate icon files, so that we can just import the icons that we need? https://github.com/Templarian/MaterialDesign-JS/blob/8ecadec56d85820a8912bd9801aba85c5acc2e81/mdi.js is currently 1.44MB in size. I feel bad about including the whole file in my bundle, just to use a few icons.

import Icon from '@mdi/react';
- import { mdiAccount } from '@mdi/js';
+ import AccountPath from '@mdi/js/Account';
Templarian commented 4 years ago

A production build in any application will tree shake unused icons.

smeijer commented 4 years ago

I agree that in a perfect world that should happen. However, for example meteorjs doesn't do this.

Templarian commented 4 years ago

@smeijer I don't know meteorjs, but in 2019 I highly doubt there is any framework that doesn't support tree shaking out of the box. Might just need to enable it. 😕

Can you please double check this. If that really is the case we can look into something, but hopefully it's as easy as us documenting something.

smeijer commented 4 years ago

First version was released in 2012, and Meteor was way ahead of it's time. Unfortunately, that's not longer the case.

There is an open ticket to add tree shaking, dating from 22 Oct 2017.

https://github.com/meteor/meteor-feature-requests/issues/206#issuecomment-341117517

edit, that being said. In the mean while I discovered https://github.com/levrik/mdi-react, which wraps these icons in React components. Which makes my life even easier.

So don't spend to much time on thinking about this topic.