三五人开发，移动端优先，兼容性要求高。使用 vue 还是 react？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 3007 天前的主题，其中的信息可能已经有所发展或是发生改变。

公司要开一个新的项目，移动端优先，需要考虑很多安卓手机的浏览器的兼容问题。

开发团队，三五人。前后端完全分离，后端只提供 API 。

听到不少关于 react 性能／兼容性方面的负面评价。尤其要微信浏览器内使用方便，乐于分享。

想用 react ，但听到不少负面评价，尤其是性能／兼容性等方面。

react 适合我们么？

vue 很不错，但总担心生态系统不健全，踩到深坑 team 没有独立解决的能力。

该如何选择呢？感谢各位！

React

兼容性

Vue

浏览器

45 条回复 • 2016-09-12 08:54:12 +08:00

dantegg

2016-09-06 14:00:50 +08:00

jquery （逃~

allce231

2016-09-06 14:03:14 +08:00

angular 吧

egen

2016-09-06 14:10:10 +08:00 via iPhone

react 微信支付有吭，安卓兼容性不清楚

Eoss

2016-09-06 14:10:15 +08:00 via iPhone

zeptojs 。（逃

mcfog

2016-09-06 14:11:02 +08:00

先想清楚你们要做的是 web app 还是 web page ，前者才需要考虑这个问题，后者的话，直接原生 H5 （ fetch/promise ）配上合适的 polyfill 就好

现在锤子是发展得比以前好的很多，但也不能看到什么都像是钉子

jiyinyiyong

2016-09-06 14:11:53 +08:00

单纯看体积的话 React 不如 Vue. 页面小运行性能差距并不明显.

jackon

2016-09-06 14:19:44 +08:00

@mcfog 感谢！

如果 web app 指的是单页应用（ SPA ）的话，
似乎懂一点了，路由一类的兼容问题，对么？

对于普通的多页应用，渲染出来跟手写的原生 H5 差别不大。
一直不理解兼容问题来自于哪里。

des

2016-09-06 14:19:51 +08:00 via Android

同五楼，你要确定是 web app 还是 Web Page ，或者纯粹只是大家熟悉那种“ H5 ”。
如果纯粹只是“ H5 ”，我推荐百度的那个，效果可以看 h5.baidu.com
如果是 Web app ，我推荐 vue ，不知道大家怎么看？

jackon

2016-09-06 14:20:36 +08:00

@jiyinyiyong 暂时不考虑做太大的页面，减少技术难度。

jackon

2016-09-06 14:22:06 +08:00

@egen 微信支付的坑，是跟路由有关么？还是跨域问题？

hronro

2016-09-06 14:23:02 +08:00 via Android

react 我在微信上用过，没太大的兼容性问题。

jackon

2016-09-06 14:23:49 +08:00

@des 不是简单的几个 html5 页面。

用户可以上传视频，做一些心理测试，然后查看测试结果。

大概是这种产品。

jackon

2016-09-06 14:24:35 +08:00

@hronro 刚想问你安卓上有没有测试，看到你的消息理有 via Android 。

感谢！

evil4u

2016-09-06 14:44:07 +08:00

用户可以上传视频，做一些心理测试，然后查看测试结果。

这类需求如果需要数据绑定，用 vue 够够的了，如果交互不多， vue 都不需要。
用什么，还是看需求。

jackon

2016-09-06 14:47:06 +08:00

@evil4u 主要还是担心以后功能大幅度增加。

毕竟，创业公司， CEO 脑洞都很大。
几个月以后，回头看。
跟当时做的，好像不是一个产品了耶。

egen

2016-09-06 14:53:24 +08:00

@jackon URL 不能带 #，支付需要单独做一个页面

learnshare

2016-09-06 14:56:09 +08:00

@jackon 路由（ URL 的问题， hashtag 的 URL 针对支付和其他接口的表现不一致）

上传视频貌似不容易，录音和上传图片倒还可以做。

至于 React/Vue/Angular ，能写哪个就用哪个，有解决坑的能力比较重要。

microchang

2016-09-06 14:59:44 +08:00 via Android

@egen react-router 可以不使用 hash ， URL 表现和普通页面一样

Zzzzzzzzz

2016-09-06 15:01:48 +08:00

react 全家桶用在移动流量下简直是犯罪.

egen

2016-09-06 15:02:43 +08:00

@microchang 是的，然而之前已经用 hash 做了 n 个页面了，调整起来很费劲，所以单独做了一个，一劳永逸

egen

2016-09-06 15:05:22 +08:00

顺便提一下，我们尝试过 react-router 不用 hash ，这种方式在 ios 微信上有坑，后退的时候历史不大正常

sudoz

2016-09-06 15:07:54 +08:00

@Zzzzzzzzz 怎么回事？大量请求？

egen

2016-09-06 15:12:14 +08:00

@Zzzzzzzzz 流量方面我们做了一个小 app ，代码量 4k 左右，首页加载 300k 左右

纯静态的好处是只要第一次加载完，后面简直不能太爽

300k 对现在的移动流量真是小意思

learnshare

2016-09-06 15:22:03 +08:00

@egen 后退不是问题，刷新才坑吧，服务器会去请求 URL 对应的静态资源，然而根本没有这个资源。

@Zzzzzzzzz Web App 流量不比看图文资讯大，代码一次请求，后续流量可以优化得跟 App 的流量消耗一样。

jackon

2016-09-06 15:28:01 +08:00

@learnshare 服务器会去请求 URL 对应的静态资源，然而根本没有这个资源

这是 server 配置的问题。不是 react 的问题。 SPA 页面的 server ，配置略有差别。

jackon

2016-09-06 15:29:43 +08:00

看大家的讨论，基本搞明白了。

很多的坑，不是 react 本身无法解决的问题，只是大多数团队不具备填坑的能力。

我们就用 react 了。

感谢各位！

des

2016-09-06 15:39:35 +08:00 via Android

@jackon 看了一下需求，真心不建议你们用 react ， vue 之类的框架。当然决定权在你们。

就算加功能也完全不用再原来的页面上，新功能可以单独出一个页面（和原功能不相关的话），省心省力
只有踩了坑才会知道

des

2016-09-06 15:44:00 +08:00 via Android

@jackon 顺带说一下，你们这个大家口中的“ H5 ”，就目前描述来看。我以前也做过

learnshare

2016-09-06 16:14:50 +08:00

@jackon 是的，但会带来比较多的麻烦。所以并不推荐改 URL 。

ChefIsAwesome

2016-09-06 16:29:27 +08:00

几个技术概念：

一. 前端模板：前端 js 取过来的数据，通过模板语言生成 html 。不用自己在那拼字符串了。

二. mvvm 数据绑定：同一个页面里头的不同 view 显示的是同一 model ，而且这些 view 都能操作这个 model ，如何保证 view 的一致性，如何简化编程难度？ mvvm 的框架都会提供绑定的概念。不同的 view 可以都绑定在某个 model 上，当这个 model 更新时，所有绑定的 view 都会更新。作为开发者，你关注的就只是用户操作时如何更新这个 model ，而不是具体如何更新 view 了。

三. virtual DOM ：上面说的 mvvm 架构里头，如果 model 是一个数组， view 是一个列表。数组中的某一项变化时，整个列表都会变化，显然这里头有性能问题。 virtual DOM 通过提供一层 html 的代理，尝试帮你解决这个问题。作为开发者，你做的仍然是绑定 model 到 view 里，当 model 更新时， view 自动更新，只是此时你绑定的是 virtual DOM ，而不是真正的 html 。 virtual DOM 会计算出真正需要更新的 html ，再去更新它们。

四. 组件化：组件化追求的是自定义标签，往 html 上头加个 class 就能实现某个功能，这种 declarative 的 api 。有很多种方式能实现这样的 api 。

五. first class 组件: 把组件当作 first class ，能用函数返回，能传给函数当参数，能通过各种方式组合，这是更高一个层面的组件化了。

前三项是扩展的关系。支持 virtual DOM 肯定支持数据绑定，肯定能把 js 取来的数据渲染成 html 。每扩展一次，肯定会加一层新的抽象，复杂程度很可能会提高。

后两项之间也是扩展关系。跟前三个一样，扩展意味着多一层抽象。

楼主还是仔细考虑考虑你们到底要干啥再选择框架吧。别只是渲染个数据，结果却搞成了各种全家桶了。

hronro

2016-09-06 16:52:55 +08:00

@jackon 安卓上没啥问题，至少 react 本身没有兼容性问题。另外支付页面不单独做一个页面也是可以的，只是要在公众号里面分别为安卓和 ios 配置两个支付地址

hronro

2016-09-06 17:00:28 +08:00

总的来说，微信安卓上的坑，基本都是 X5 内核本身的坑，这些坑就算不用 react 用其他的框架也会遇到。至少我在微信上用 react 开发了半年时间，没遇到 react 的安卓兼容性问题

zhouquanbest

2016-09-06 17:08:35 +08:00

我们人更少然后老大拍板用 pug 后端渲染。。。。。。。。
先发发现绝大多数展示用界面挺好用的
复杂的再用 react

66beta

2016-09-06 17:11:01 +08:00

React 吧，社区比较健壮
vue 国内用得多，但是社区贡献少

jackon

2016-09-06 17:27:14 +08:00

@66beta 是的，社区比较重要。

@zhouquanbest 不想继续搞后端渲染。前端彻底分离开发了。

jackon

2016-09-06 17:27:51 +08:00

@hronro 的确，微信的问题，只能针对性的去处理了。

jackon

2016-09-06 17:28:44 +08:00

@ChefIsAwesome 不是个人的玩具项目，也不是短期的小项目。所以，前期的选型、架构，都很重要了。

coldsnap

2016-09-06 22:23:45 +08:00

担心 react 体积的话可以用 preact 或者 react-lite 。在移动端 Vue 的生态也很好，组件非常多（大部分是 1.0 的）。
微信支付的问题只要是 SPA 都会遇到，不管是 vue-router 还是 react-router ，前端不管是用 hash 还是 history popstate 都会有问题。