如果我们的Vue项目中没有用到任何UI框架的话，为了更好的用户体验，肯定会用到loading和toast。那么我们就自定义这两个组件吧。

现在好多APP都采用了Hybrid的开发模式，这种模式特别适合那些内容变动更新较大的APP，从而使得开发和日常维护过程变得集中式、更简短、更经济高效，不需要纯原生频繁发布。但有利肯定有弊咯，性能方面能稍微差一点，还有就是两者之间的交互问题。美团、爱奇艺、微信等知名移动应用，都是采用Hybrid App开发模式。Hybrid开发已成为未来的一种发展趋势。

目前项目中比较常用的第三方支付无非就是支付宝支付和微信支付。下面介绍一下Vue中H5页面如何使用支付宝支付。其实很简单的，只不过是调自己后台的一个接口而已（后台根据支付宝文档，写好支付接口）。

gzip是GNUzip的缩写，它是一个GNU自由软件的文件压缩程序。它最早由Jean-loup Gailly和Mark Adler创建，用于UNⅨ系统的文件压缩。我们在Linux中经常会用到后缀为.gz的文件，它们就是GZIP格式的。现今已经成为Internet 上使用非常普遍的一种数据压缩格式，或者说一种文件格式。

使用 CSS 可以绘制出许多形状，比如三角形、梯形、圆形、椭圆等，并不只是可以绘制矩形。下面列举一些基本形状和组合形状。基本形状是比较容易实现的，而利用这些基本形状进行组合，就可以实现稍微复杂点的组合形状。

如今的前端项目追求的不仅仅是能用能看的程度，而是愈发追求项目的性能，对用户体验的影响。而现在的开发工具在性能优化方面也替我们做很大一部分的工作，想必大家对CDN的使用都是轻车熟路了，但是大家有没有考虑过，万一我们使用的CDN服务器，地址啥的出现了问题，导致我们引用的CDN文件都拿不到了，那么我们的项目崩溃了，天了噜，崩溃了。

Vue项目中使用Vue.js devTools这款调试神器，可以极大程度的提高我们的开发效率。

ElementUI的Table表格，官方网站上提供了很多样式，但是在日常开发中还会碰到各种情况，显然官方提供的是不能满足需求的。那么，我们就根据自己的需求对table进行改造。

由于自身的项目比较简单，只有几个H5页面，用来嵌入app中，所有没有引入移动端的UI框架，但是介于能让用户在浏览H5页面时有下拉刷新和上拉加载，有更好的用户体验，自己写组件实现。

ElementUI的Upload上传，配合七牛云储存图片。

vue-router的HTML5 History 模式，这种模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面。

在日常的项目开发中，我们会用到各种第三方库来提高效率，但随之带来的问题就是打包后的vendor.js体积过大，导致加载时空白页时间过长，给用户的体验太差。为此我们需要减少vendor.js的体积，从本质上来解决这种问题。

项目中我们可能会碰到导出Excel文件的需求，一般后台管理系统中居多，将table中展示的数据导出保存到本地。当然我们也可以通过一些处理来修改要导出的数据格式，具体需求具体对待。

前后端分离的项目开发中，我们有开发环境、测试环境、预生产环境和生产环境。

1、动态绑定图片

Ajax（Asynchronous JavaScript and XML）由Jesse James Garrett于2005年提出（尽管如果除了XML还有很多选择，最著名的是JSON）。AJax不是一个单独的、需要许可证的技术，而是一组技术，包括JavaScript、CSS、DOM和异步数据获取。Ajax的目的是为了突破Web本质的开始-停止交互方式。向用户显示一个白屏然后重绘整个页面不是一种好的用户体验。而Ajax在UI和Web服务器之间插了一层。这个Ajax层位于客户端，与Web服务器进行交互以获取请求的信息，并与表现层交互，仅更新哪些必要的组件。它将Web体验从“浏览页面”转变为“与应用程序进行交互”。

减少呈现页面时必须的HTTP请求数量是加速用户体验的最佳方式。可以通过最大化浏览器缓存组件的能力来实现这一目标，但当网站被宿主在多于一台服务器上时，ETag头可能会阻碍缓存。

在一个页面中两次包含用一个JavaScript文件会损伤性能。导致一个脚本的重复有两个主要因素——团队大小和脚本数量。页面中的脚本越多，就越有可能将一个脚本包含两次。

重定向（Redirect）用于将用户从一个URL重新路由到另一个URL。重定向有很多种——301和302是最常用的两种。通常针对HTML文档进行重定向，但也可能用在请求页面中的组件（图片、脚本）时。实现重定向到可能有很多不同的原因，包括网站重新设计、跟踪流量、记录广告点击和建立易于记忆的URL。重定向会使页面变慢。

精简（Minification）是从代码中移除不必要的字符以减少其大小，进而改善加载时间的实践。在代码被精简后，所有的注释以及不必要的空白字符（空格、换行和制表符）都将被移除。对于JavaScript而言，这可以改善响应时间效率，因为需要下载的文件大小减小了。

Internet是通过IP地址来查找服务器的。由于IP地址很难记忆，通常使用包含主机名的URL来取代它，但当浏览器发送其它请求时，IP地址仍然是必须的。这就是DNS（Domain Name System）所处的角色。

JavaScript和CSS是应该包含在外部文件中还是内联在页面中？ 通常使用外部文件更好。如果JavaScript和CSS是外部文件，浏览器就能缓存它们，HTML文档的大小减小，而且不会增加HTTP请求的数量。

CSS表达式是动态设置CSS属性的一种强大（并且危险）的方式。对CSS表达式的频繁求值使其得以工作，但也导致CSS表达式的低下性能。有两种技术可以避免CSS表达式这一问题——创建一次性表达式和使用事件处理器取代CSS表达式。

前面介绍了将样式表放在页面的底部会阻碍页面逐步呈现，以及如何通过将其移至文档的HEAD中来解决这一问题。脚本（外部JavaScript文件）会引起类似的问题，但解决方案恰好相反——最好将脚本从页面的顶部移到底部。这样页面既可以逐步呈现，也可以提高下载的并行度。

关心性能的前端工程师都希望页面能逐步地加载，也就是说，希望浏览器能够尽快显示内容。为用户提供可视化回馈的重要性已经有了很好的研究和记载。将样式表放在文档底部会导致在浏览器中阻止内容逐步呈现。为避免当样式变化时重绘页面中的元素，浏览器会阻塞内容逐步呈现。而将样式表放在文档顶部对于加载页面所需的实际时间没有太多的影响，更多影响的是浏览器对这些组件顺序的反应。实际上，用户感觉缓慢的页面而是可视化组件加载得更快的页面。

通过减小HTTP响应的大小来减少响应时间。如果HTTP请求产生的响应包很小，传输时间就会减少，因为只需要将很小的包从服务器传递到客户端。这一效果对速度较慢的带宽尤其明显。使用gzip编码来压缩HTTP响应包，并由此减少网络响应时间。这是减小页面大小的最简单的技术，但影响是最大的。

如何配置组件，使其能够最大化地利用浏览器的缓存能力来改善页面的性能。如今的Web页面都内包含了大量的组件，并且其数量在不断增长。页面的初访者会进行很多HTTP请求，但通过使用一个长久的Expires头，可以使这些组件被缓存。这会在后续的页面浏览中避免不必要的HTTP请求。长久的Expires头最常用于图片，但应该将其用在所有的组件上，包括脚本、样式表和Flash。

内容发布网路（CDN）是一组分布在多个不同地理位置的Web服务器，用于更加有效地向用户发布内容。通常只在讨论性能问题时会提到它的性能，但它还能节省成本。在优化性能时，向特定用户发布内容的服务器的选择基于对网络可用度的测量。

根据性能黄金法则，改善响应时间的最简单的途径就是减少组件的数量,并由此减少HTTP请求的数量。

前端性能的重要性解释了有80%~90%的时间花在了显示Web页面上，只有10%~20%的是花在从Web服务器获取HTML文档并传送到浏览器中的。如果希望能够有效地减少页面的响应时间，就必选关注这80%~90%的最终用户体验。

Git Flow 是什么

说到分支管理模型，令人最为熟悉的莫过于TrunkBased 和 GitFlow。