gulpwebpack区别 gulp webpack区别

html和小程序的区别

第一条、运行环境的不同

传统的HTML5的运行环境是浏览器，包括webview，而微信小程序的运行环境并非完整的浏览器。

第二条、开发成本的不同

抛去开发工具（vscode、sublimtext、Atom等）不谈，大到前端框架（Angular、react、vue、backbone等）、模块管理工具（Webpack 、Browserify 等）、任务管理工具（Grunt、Gulp等），小到UI库选择、接口调用工具（ajax、Fetch Api等）、浏览器兼容性等都要我们一一考略，再不济用jqery插件写H5，也要在开发过程中去寻找合适的jquery插件来配合项目。

第三条、获取系统级权限的不同

微信小程序相对于HTML5 web应用能获得更多的系统权限，比如网络通信状态、数据缓存能力等，这些系统级权限都可以和微信小程序无缝衔接，也就是官方宣称的拥有Native App的流畅性能，而这一点恰巧是HTML5 web应用经常被诟病的地方，这也是HTML5的大多应用场景被定位在业务逻辑简单、功能单一的原因。

第四条、应用在生产环境的运行流畅度

最容易区分小程序与H5的一点， 打开H5，实际上是打开一个网页，而网页需要在浏览器中渲染，面对复杂的业务逻辑或者丰富的页面交互时页面会卡顿。

而微信小程序，直接在微信上运行，省去了通过浏览器渲染的步骤，因此，在微信中使用小程序，才会比H5流畅很多。除了首次打开需要几秒的加载时间外，小程序各个页面的切换、跳转等体验已经媲美原生App，非常顺畅。

前端的学习步骤

html/html5/css3:

学习过html标签&css之后，可以去看h5的新特性和css3的新属性，都是一些死东西，基本看w3c官网就可以学会，之后找一些页面照着敲一敲。（注意学习兼容性）。

js能力的提高：

前端其实是上手易精通难的行业，能力还是体现在js上，掌握了基础的DOM操作后，应该去看js的oop编程，和后台的面向对象还是有一些区别的，其他的如：prototype/闭包/简单的js算法（三大排序、数组去重）等，之后可以去看js设计模式的书。

UI库/js库：

jquery肯定是要掌握的，学起来上手也很快，UI库更是如此。不用花太多时间在这个上面，能达到熟悉的程度就好，现用现看文档都来得及。

node.js：

现在的前端都是要会node.js开发的，主要原因有两个

1）node.js可以作为中间层，调用后台的接口，自己组装数据转发给前台，并且可以对session等状态做存储。

2）一些自动化工具比如less/gulp/webpack和一些框架比如Vue.js是居于node的。

所以node.js也应该了解一下，在实际的开发中做中间层比较多，主要作用就是转发。

基于nodejs的框架可以学习express/KOA，上手难度都不大。

三大框架Vue/angular/react：

可以从Vue入门，Vue时最简单的，掌握了之后再去看其他两个框架，前端的框架太多了，但大多数MVC框架都是大同小异，打好基础的话学习起来很快，微信小程序开发也一样。

移动端开发：

rem、媒体查询、配置适口标签、flex布局等掌握后就可以开发移动端网页了。主要就是对字体配置的兼容。