React、Vue 和 Angular 的拥护者之间不断发生激烈的战争。很多人都想证明自己的框架是最好的，而其他的不值得花时间去学习。然而，尝试过使用这三种工具的专家表示，根本没有更好的工具 - 每个框架都可以让您尽可能有效地解决某些问题，而对于其他问题，还有更合适的方法。在这篇评论文章中，我们将了解 React 和 Vue 的优缺点。
对于初学者来说什么是最好的？
对于初学者来说，最好的解决方案是尽快开始学习任何乐器。关于此事的任何建议和争论都是开发人员的主观意见，他们曾经也受到了老同志的影响。
为了不陷入单一方法追随者的恶性循环，为了保持开放性并且不被特定方法所困扰，您应该简单地采用第一个分配的项目所在的框架。这样，程序员将能够在工作时掌握该工具，专注于它最必要的方面。
反应
React 根本不是一个框架，而是一个开源库。它非常适合简单项目，其目标之一是快速收回成本。具有分支结构的大型站点更容易在 Angular 中创建。
“为什么 React 比 Vue 更好”这个问题有不同的答案。例如，第一个在生态系统的丰富性方面超越了第二个，并通过大量可用的自定义渲染工具取悦其追随者。但 React 的主要优势是其活跃且发达的社区。
在“实时”社区的帮助下，您可以：
快速或相对快速地找到复杂或非典型问题的解决方案
使用大量任何形式的培训材料——视频、文本、表格、图表；
快速了解新的解决方案和机会；
找到一位导师，并在他的建议下更快地进步；
使用现成的开发，只需对其进行修改即可。
维埃
View相当开放，容易接受新人；反应性高，组件结构。程序员在使用其他框架后很容易切换到它，因为 View 吸收了 Angular 和 React 的最佳功能。许多开发人员认为它是初学者最容易使用的选择。
Vue 的主要缺点是缺乏与 React 和 Angular 同等数量的培训材料和开发社区。但这是暂时的——这项技术相对较新并且需求很大。
如果我们谈论为什么 Vue 比 React 更好，我们会想到 CLI 项目生成器 - React 没有这么方便的功能。它允许您使用交互式向导快速轻松地启动新项目。它还用于即时组件原型设计。 Create React App 是 CLI 的近似类似物，也提供了应用程序的快速启动。
一般特点
值得注意的是，这两种技术不仅有差异，而且参数相似，这让那些想要确定 React 和 Vue 哪个更好的人感到困惑。两者都可以让您快速了解流程、研究环境并开始活动。至于速度，它也不太可能成为选择的决定性因素（两种工具的速度都很高）。
混合应用程序开发可用如反应本机，以及在 Vue Native 中。
所比较的技术使用虚拟 DOM，这是标准 DOM 的轻量级副本，它允许您进行必要的更改，然后将它们与原始版本进行协调。也就是说，在用户的屏幕上，只有与原来不同的部分才会被替换。该解决方案可以减少流量并加快内容的加载速度，从而使用户与页面的“第一次接触”更近，从而降低跳出率。对于智能手机用户和互联网连接速度较慢的人来说尤其如此。
注意网络应用程序开发可以同时使用这两种工具。
Redux/Vuex
如果我们仔细研究应用程序状态管理解决方案，我们就会发现这些方法彼此之间有多么相似。例如，Redux，它更常与 React 一起使用，与 View 交互得很好。但 Vue 开发人员朝这个方向迈出了下一步——他们创建了 Vuex，它更加深入地集成到系统中。
MobX 和 React 几乎是 Vue
React 通常与 MobX 结合使用。它相当流行，其反应系统与 Vue 极其相似。为了简单起见，我们可以将这种组合称为 View 的更详细的变体。如果一个人使用这种方法并且喜欢它，那么切换到 Vue 可能是一个非常好的主意。
几乎不可能明确回答“为什么 React 比 vue 更好”这个问题。在比较两种技术时，无论其功能是为相同的任务而设计的，一切都取决于程序员的个人喜好。是的，抽象的反应开发者会相信他做出了正确的选择，他的框架 摩洛哥电话号码数据 是最好的。但这对于出现的每项任务都是如此吗？我们必须记住，任何方法在某种程度上都是好的——有必要评估上下文，而不是盲目地使用你最喜欢的技术。如果一个按钮涉及可重复的步骤（设置、编辑、标记收藏夹），那么将其放在顶部是合乎逻辑的。对于在线商店，仅将购物车图标添加到标题中，并将“购买”添加到产品卡的底部。
水平和垂直
号召性用语按钮可以在移动屏幕环境中分组在一起。如果两个这样的元素并排放置，这通常意味着它们通过共同任务连接。例如，“是/否”、“前进/后退”、“接受/跳过”。
人们习惯于认为附近的事物之间存在某种联系，因此从两个对象中选择一个会更容易理解和合适。此外，两个按钮水平排列成一排传达了它们同等重要的含义。
移动优先 - 2019 年的通用开发方法或简单的网页设计趋势 - 6 - image
如果你把它们一个放在另一个下面，就会有不同的感觉——作为主要和次要，具有完全不同的背景。一个很好的例子是市场上的“购买”和“写信给卖家”。一个命令不会取消另一个命令，但“购买”似乎具有更高的优先级。
号召性用语的视觉语言
主按钮并不总是需要固定在严格的位置。如果它以颜色突出显示并且形状和大小不同，人们就会理解。
移动优先 - 2019 年的通用开发方法或简单的网页设计趋势 - 7 - image
在该示例中，“开始”块字面上表明它是主要块。
重要提示：如果移动网站界面很复杂，有许多不同的按钮，您需要仔细考虑视觉层次结构，以便它们的作用是直观的。
一个简单的例子：所有确认按钮都是大的绿色的，所有拒绝按钮都是红色的。 “购买高级访问权限”完全是蓝色的，以强调其排他性。查看几页后，人们可能无法在单击时阅读文本，这取决于他们的视觉层次结构。最重要的是，不要辜负期望，也不要打破这个习惯，因为你在个人帐户的荒野中发现了一个大的绿色块，上面写着“永远删除我的帐户”，这是由前端开发人员匆忙添加的。
粘滞按钮
我们都习惯了粘性菜单和其他项目，尽管滚动页面，它们仍保持相对于屏幕的位置。对于智能手机，在使用此技术捕获号召性用语时需要小心。
移动优先 - 2019 年的通用开发方法或简单的网页设计趋势 - 8 - image
事实上，如果用户不触摸屏幕的底部或顶部边缘，移动浏览器会自动隐藏其界面。这样做是为了不引人注目地提供更多稀缺的可用空间。
有时，开发人员会在底部放置一个带有重要目标操作的“粘性按钮”，认为访问者将不可避免地注意到它并做出反应。然后它突然跳起来，因为手机将屏幕底部的点击解释为显示浏览器界面的请求。虽是一件小事，却让人气愤不已。值得记住的是，如果用户在使用产品时感到不适，网络开发趋势并不重要。
来源：
移动网站优化清单
正确选择图像以在不同类型的屏幕上显示。照片内容的质量足以在智能手机的视网膜显示屏上显示而不会模糊。
横幅在不同的设备上具有正确的宽高比。如果在手机上横幅往往具有方形或纵向形状，那么在桌面上它往往具有更宽的水平形状。
所有按钮的尺寸都足够大，并且不会太靠近，以防止意外按下。
实施 优化网站加载速度，所有不必要的东西都被删除了。
输入字段定义正确，指示类型。对于输入电话号码和信用卡尤其重要 - 在智能手机上，建议仅打开数字键盘。
本机输入用于指定日期、时间和其他特殊格式。这也可以通过正确指定输入字段的类型来实现。
如果链接排列在列表中，一个在另一个下面，则它们在文本周围有可点击的区域，这样用户就不必寻找将手指放在哪里。
对于内容，指示了合理的边缘边距和舒适的行距。
使用延迟加载逐步或按需加载技术数据 - 对于带有产品卡的大型轮播尤其如此。
为了Google Mobile First Indexing，有几点：
根据 Google 的说法，合理的字体大小至少为 14-16px；
文本内容结构化并分为段落；
句子长度不超过50-60个字符；
文本相对于背景有适当的对比度；
移动版和桌面版的内容同样丰富；
所有可点击元素都有一个您可以实际用手指点击的活动区域 - 高度至少为 44 像素；
HTML5标准用于显示媒体内容；
物体之间有足够的自由空间；
弹出窗口不会干扰学习内容；
观察到微标记，尤其是在线商店的页面以及面包屑和联系页面上；
网站加载速度快；
由于水平方向比手机屏幕更宽的元素（例外：画廊和可刷卡块），因此不会产生额外的滚动。
来源：
一根手指和一只眼睛
与手机的交互速度比与台式电脑的交互速度快得多。此外，智能手机还会在分散注意力和令人恼火的环境中使用。
谷歌首席产品官兼《移动优先》一书的作者 Luke Wrobleski 指出，移动体验必须将高速交互与简单功能和清晰的信息呈现相结合。典型用户用一根手指操作智能手机，几乎只用一只眼睛专注于屏幕，进行频繁但短暂的会话。因此，2019 年用户体验设计的趋势越来越关注交通中的速度和小工具的使用。
“一根手指和一只眼睛”规则可以安全地应用于定性评估移动应用程序设计或响应式网站。整个原理就是这样一个问题：“用户能否在六十秒内用一根手指和一只眼睛执行所需的操作？”
为什么只有一分钟？每天使用智能手机执行各种任务超过 150 次的人们没有额外的 5-10 分钟来掌握繁琐或不清晰的界面。如果您未能在互动截止日期前或未能传达必要的信息，用户将直接去找能够做到这一点的人。对速度和可用性的需求是 MT 动机的基石
