微信小程序为何不采用骨架屏技术来优化加载体验？

本文共计1722个文字，预计阅读时间需要7分钟。

微信小程序中应用框架屏的技巧及实现原理，以及如何提升框架屏项目PR。

骨架屏在前端的应用里很普及，不过大多都是在H5的应用中，今天想谈的是微信小程序中如何使用骨架屏，以及小程序骨架屏的实现原理，针对骨架屏项目还可以提个PR，封装出来一个npm包形式的第三方，为前端社区做点小贡献。

如何在微信小程序中使用骨架屏？

---

一、安装和引入

1.安装组件：

npm install --save miniprogram-skeleton

2.引入skeleton自定义组件

{ "usingComponents": { "skeleton": "../miniprogram_npm/miniprogram-skeleton" } }

小程序中npm的配置及使用：

• 在微信开发者工具中，设置 —> 项目设置—> 勾选使用npm模块。

• 在微信开发者工具中，工具 —> 构建npm，构建完成会生成 miniprogram_npm 文件夹，项目用到的npm包都在这里。

• 按照页面的使用路径，从 miniprogram_npm 引入需要的包。

注意下小程序中npm的配置及使用比普通的npm包的使用多了一些配置，引出了 miniprogram_npm 的概念。