zyyzyykk/file-icons-vue

能不能改用 class 渲染,使用 base64 太占资源了。

Closed this issue · 4 comments

对于一个文件树的话,其实大部分图标会渲染多份。若是使用 base64 作为渲染媒介。会导致页面负荷太大了。最好有基于 style 的渲染方式。

我打算使用将图标变成字体文件优化渲染

后续会将新版本的代码提交至npm仓库

这个需要 svg/symbol 符号引入。相关帮助的库在 iconify 上可以看到。我写的实现是参考其原理写的。只不过其是用符号连接,使 用 ::before 元素加载。我已经将 一些逻辑抽取出来了。做了两个工具库。分别是 loadIcon 和 useIcon 。

在新的提交里我加入了 TS 支持

这是新的库的案例图。
image

你需要编写新的版本说明,并打包发布。

新特性路线

  • 我想改一下构建工具 vue-cli 为 vite 。
  • 并修改其 loader option 。使其支持导入 svg 。
  • 并将8K小图转换 base-64 这种默认行为改为导入 url , 这样就可以 自己补充图标,而不影响代码逻辑结构。
  • 新增工具函数,将图包,打包成base64.js文件。或者雪碧图。这时候加载一张图片,而不是多张小图图片。
  • 新增动态引入,增加CDN支持。