search

matsp / material-components-vue

Material Design styled components for Vue.js
https://matsp.github.io/material-components-vue
MIT License
303 stars 44 forks source link

Built js files are too large #386

Open tychenjiajun opened 5 years ago

tychenjiajun commented 5 years ago

Describe the bug The built js files in https://unpkg.com/browse/material-components-vue@1.1.0/dist/button/ are too large compared to other components library like Element or Buefy.

To Reproduce Steps to reproduce the behavior:

  1. Go to unpkg.com
  2. Check the file size.

Expected behavior Built files should be smaller, maybe less than 10kb for each component.

matsp commented 5 years ago

@tychenjiajun They are both not using mdc-web. Can't find the dependency. Our compononents are so big because of mdc-web.

Alan-Liang commented 5 years ago

I made a size comparison of importing material-components-vue using different methods.

import method css size js size(vendor)
npm index.js 34.3K 585.6K
npm min.js 34.3K 192.7K
direct clone 34.3K 155.9K

Clearly index.js uses eval(), and that's bad for optimization. *.min.js is better, but has cross-references which leads to extra bytes.

These files are generated by vue-cli.

cjblomqvist commented 5 years ago

Probably due to the underlying library (material-components-web), which is developed by Google. So not much to do there (except for the first one).

It would be nice though if the components folder is brought along when publishing so one doesn't have to clone the repo to be able to go with the 3rd option. That also enables component-specific imports (now one must import/add each component globally).