微信端 h5 页面开发，如何选择轻量级的框架

[goodlord]

我已经开发了一个类似有赞的微店店铺，在微信 app 里扫码打开，后端用的 spring ，前端用的 bootstrap 4 ， angular 1.4 ，自己手写 css 和 html 。问题是首页加载比较慢，所有的 js 都在首页加载了，听说 angular 框架是重量级的。所以上网搜索了一些框架： angular 2 ， ionic ： https://github.com/driftyco/ionic ， mobile-angular-ui ： https://github.com/mcasimir/mobile-angular-ui 。

angular2 是移动优先的， ionic 里用到了 angularjs 2.2.1 版本，但是它提供的控件啥的我这个网站貌似用不到， mobile-angular-ui 好像也要引用 angularjs ，不知道啥版本，它能提高网站的响应速度吗？还有推荐 react.js ， vue.js 的。

请教各位，我该使用哪个框架来获得最好的加载速度和响应速度以及性能？

[lhx2008]

weui ？

[JohnLou]

写原生，相信哥。

[anubiskong]

如果是我, 最多用个 backbone
永远不要小看安卓兼容性的垃圾程度, 不要使用任何新奇的技术, 除非它本身是用来解决兼容性的.
angular2 我在实际项目中间接的用过, 这种屎一样的东西不想再碰了, 无论是兼容性还是使用的体验各个方面.
微信内的电商项目明显是业务侧重, 所以你别想着用新技术了, 把重点放在业务层面的实现上会让你轻松很多, 光是业务层面就够坑爹了
祝项目顺利

[rockdai]

原生，样式可以 weui

[dqh3000]

是哪的问题，加载速度还是响应速度，你可以测试啊

我觉得响应速度如果没用很复杂的东西的话应该差不多太多吧

加载速度也有网络因素的，如果是要减小文件体积，那有各种方法的，例如模块分割， gzip ，提高服务器带宽，这些可能都比换框架快吧？

如果一定要换，也得证明瓶颈在框架吧

[learnshare]

页面不复杂的话， jQuery 也无妨

[jarlyyn]

问题是慢，还是大。

[murmur]

微信端不就是偏浏览么，你真想做成 app 啊，那基本没戏的
没几个人有招行那个魄力，人家的东西就是纯服务的，你封了也不怕人家照样有客户端撑着

[lijsh]

用什么工具和业务场景有关，如果逻辑简单的话原生足矣；但店铺这种应该上框架的了， angular 和 bootstrap 其实也没什么不对，很多微信端的 app 都用，想快一点可以看看工程上有什么可以做的：
bootstrap 有 angular 版本的组件集 https://angular-ui.github.io/bootstrap/ ，建议原生 bootstrap 只引入 css ，其它组件用这个；
首屏是重中之重， index.html 可以给一点初始元素，先把首屏内容渲染出来。
做好打包工作，看看有没需要按需加载等等。

[lijsh]

移动端的话 vue 更轻量，我们的移动项目也在用。

[goodlord]

@anubiskong ,现在业务层的逻辑不复杂，处于 demo 阶段，以后可能会慢慢变得复杂。新技术对安卓手机的支持很不好吗？

[goodlord]

@dqh3000 ，瓶颈确实可以调试，但是 angular1.x 已经是公认的重量级的框架了，给人的印象就是不适合移动端的开发。 angular.min.js 142kB, 用时 27ms, angular-ui-router.min.js 28.2kB,用时 25ms 。所有的 js 都在首页加载了。

[goodlord]

@lijsh ，没感觉很多 app 在用这个，现在只用了 bootstrap.min.css, 4.0 版本的， bower 安装 bootstrap 后出现了你说的 angular-boostrap 文件夹，应该对应你给的链接了，你说的先给一点初识元素不是很懂， vue 好像国内的人用的比较多，你觉得如果用 vue 或者 angular2 会不会带来性能提升？

[goodlord]

@jarlyyn ，首页加载慢，主要是有很多图片，图片压缩过还是大，有一些图片有几十 KB 。

[jarlyyn]

如果是 js 的问题，可以用 requrie.js
速度慢可以考虑用 cdn

前端永远会处在一个不断重构的过程中。

没有必要的话，不需要强行上新技术。等你坑踩遍了，更新的坑又出来了。

一般来说， backbones+jquery/zepto,足够对付一般的应用了。

最后，没必要 bootstrap

[anubiskong]

@goodlord 我是个半吊子程序员和产品经理, 不懂算法也不懂架构, 只是用过的东西很多所以有些许自己的观点, 另外接触了个别大牛也是深有感触. 要说唯一从 10 年从业中学到的, 就是"简洁". 无论什么需求什么行业甚至是 IT 以外的生活做人方面深深的体会到简洁的好处. 前端已经不是 5 年前那种荒芜之地了, 在现在这规范已经比较成熟的年代, 用用 jquery backbone underscore 啥的就可以把 js 包装成很好的工具了, css 方面用上 less/sass 就是如此, 再添加新东西进去都是没必要的. 什么 google 什么微软甚至于苹果, 这 10 年来我见过他们搞的像样的东西就是 webkit, 其他都是屎

[zhouquanbest]

没太大必要针对微信选择框架吧
平时 H5 喜欢什么就什么咯

而且微信兼容性挺好的 TBS （ Android 公测）已经 3.0 升级到 Chrome52 内核那个版本了

[jimyan]

vue

[finely]

vue 很轻量，兼容性也不错

[em70]

微信小程序马上出来，还做 HTML5 会死得很难看

[dqh3000]

@goodlord 图片可以 lazy load ，我没有反对你换框架，我只是说明确原因在哪

所有的 js 加载都在首页，是指模块的加载吗？如果这样要考虑怎么分开，我现在用 react ，模块分开主要是基于 webpack 的延迟加载

[zhihaofans]

@em70 微信不也是 html5 吗。。。

[em70]

@zhihaofans 小程序不是 HTML5

[goodlord]

@dqh3000 所有的 js 和 css 都在首页引入了，跳转到其他页只是 html 里的 body 被替换了，用了 ui-view 指令。网上说了： Angular 以及所有前端 SPA 程序，都有一个通病：首次加载太慢，要下载完所有 js 和 css 才能渲染出完整的界面来。 React 通过虚拟 DOM 解决了此问题，而 Angular 2 则通过独立的服务端渲染引擎解决了这个问题。不知道是不是真的。你觉得 react 好用吗？

[dqh3000]

@goodlord

这样理解是不对的，没有“一定必须”下载所有 js 和 css 才能渲染出完整界面的说法

就例如你的网站有 100 个页面，这是很可能的吧，然后每个页面可能都有独立的业务逻辑， css 样式，如果一个 SPA 应用都必须一开首页就把所有 100 个页面的所有逻辑（ JS 代码）和 css 样式都下载下来，然后才能用，那 SPA 早就没人用了～～

现在很多框架都能服务端渲染的，不止 Angular 2 ，这个确实解决了一些问题，不过也带来了另一些问题～～

我的意思是，如果这个是加载速度的问题，那有也就无非是服务端渲染，或者各种模块独立，各自延迟加载等方法。

如果是渲染速度有问题，那基本上没什么解决办法了，用更轻量级的框架好了……例如不用框架

[Pan940425]

歪个楼，每次看到把“ html5 ”缩写成“ h5 ”的时候，我都特别想问一句，你们让“ java8 ”情何以堪。。