皮皮网

1.前端开发和web前端开发的区别
2.HTML5和小程序的区别
3.Web前端开发主要学哪些？

前端开发和web前端开发的区别

       ç§»åŠ¨å‰ç«¯å¼€å‘å’Œweb前端开发都属于前端开发，具体有以下区别。

       1、业务的应用场景

       web前端开发主要指传统的PC端网页开发，页面主要是运行在PC端浏览器中，移动前端开发出来的页面主要是运行在手机上。

       ç›´è§‚上会感觉，PC端页面大一些，移动端页面小一些，但是根据开发经验，页面大可并不代表书写的代码复杂，页面小也并不意味着开发简单，难与易主要还是取决于具体的业务需求。

       2、新技术的使用

       ç”±äºŽåœ¨ç§»åŠ¨ç«¯ä¸»è¦ä»¥webkit内核为主，对于HTML5等新技术支持的更好，所以可以更大范围的使用新技术，而PC端开发由于很多场景下要求兼容IE等老版本浏览器，出于浏览器兼容性的考虑，有些情况下限制了新技术的使用。

       3、页面的适配性

       ä¼ ç»ŸPC端的页面开发一般都会选择给页面设定一个固定宽度，两侧有留白，但是移动端的页面由于其载体手机屏幕比PC要小很多，一般都会选择尽可能多的在手机屏幕上显示内容，这就要求移动端页面要能够充分适应各种屏幕尺寸的手机并进行最大程度的利用。

       ä»Žè¿™ä¸€ç‚¹ä¸Šæ¥è¯´ç§»åŠ¨ç«¯é¡µé¢çš„适配难度更高一些。

       4、页面的性能

       PC端的网络情况一般比较稳定，都是通过网线或者Wi-Fi连接网络，但是移动端就比较复杂，除了Wi-Fi，还有2G、3G、4G甚至是在几种不同的网络连接中交替切换也经常发生。

       ä¸ç¨³å®šçš„网络连接对页面性能带来的挑战是移动端的页面资源不能太大，否则在恶劣网络情况下时，页面将会无法访问 ，严重影响用户体验。

       5、框架选型

       ç”±äºŽç§»åŠ¨ç«¯ç½‘络情况的不稳定，导致我们在移动端页面框架选型时，一般只考虑小而美的框架，例如像zepto.js这样的压缩之后只有9.6K，就能满足一般业务的需要，如果是想要构建更复杂的单页面应用，可以选择像vue.js这样的框架，功能强大，但体积压缩后却只有多K。

       è€Œweb端相对选择的范围就比较大，一些比较重型的框架也可以根据项目需求加以考虑，例如古老但庞大的ext.js，依然凭借着众多UI组件活跃在一些企业的后台管理系统项目中。

扩展资料

       Web前端开发需要掌握的技术：

       1、熟练掌握前端开发技术(HTML5、JS、JSON、XHTML、CSS3)，了解各项技术的相关标准。

       2、掌握Ajax异步编程，能够写出高性能、可复用的前端组件。

       3、对OO、MVC、MVVM等编程思想、前端框架有深刻理解，熟练掌握一个前端框架（常用前端框架 Vuejs，AngularJS，React，Bootstrap，QUICK UI，移动端有：Frozen UI，weUI ，SUI，MUI，AUI）了解其原理（框架有很多，选择两三个主流的框架，熟练，深度了解才可以）。

       4、善于Web性能优化，可访问性、对SEO等有良好的体验；理解表现层与数据层分离的概念、 Web语义化（这些也是在找工作中，很有用的加分项）。

       5、了解前端安全机制，熟悉HTTP协议以及浏览器缓存策略。

       6、熟悉常见JS开发框架源码实现，（如：prototype、jQuery、Mootools，Ext， Dojo，underscore、YUI、Kissy），至少熟练一种（当然也不要去选一些用的人很少的框架，要明白大项目都是团队做，不能自己搞一套）。

       7、拥有良好的代码编写，设计文档撰写的经验，熟练使用Git等版本控制工具。

       8、对常见的浏览器兼容问题有清晰的理解，并有可靠的解决方案，如IE6/7/8/9、 Firefox、Safari、Chrome。

       9、具有较高的审美（这个很重要，多去见识一些模板，高端的项目，就能感觉到有多大的差距）。

HTML5和小程序的区别

       ä¸€ã€è¿è¡ŒçŽ¯å¢ƒçš„不同。

       ä¼ ç»Ÿçš„HTML5的运行环境是浏览器，包括webview，而微信小程序的运行环境并非完整的浏览器，大家注意，我这里写的是“非完整的浏览器”，有以下几个原因

       å°ç¨‹åºçš„开发过程中会用到HTML5相关的技术(并非全部)

       å°ç¨‹åºæœ€åŽçš„发布上线需要微信审核，微信在不更新自身软件的情况下可以将小程序更新到自身软件内，这就联想到了React Native框架,源码shiet指标源码意义并且已经有开发者在微信小程序的开发工具源码中发现使用了React和NodeWebkit库

       å®˜æ–¹æ–‡æ¡£ä¸­ç€é‡å¼ºè°ƒäº†è„šæœ¬å†…是无法使用浏览器中常用的window对象和document对象（基于这一点，像zepto/jquery这种操作dom的库就被完全抛弃了）

       æ‰€ä»¥æˆ‘个人认为，小程序的运行环境很有可能是微信开发团队基于浏览器内核完全重构的一个内置解析器，针对小程序专门做了优化，配合自己定义的开发语言标准，提升了小程序的性能。

       ä¸è¿‡ç”±äºŽå¾®ä¿¡ç»™å¼€å‘者提供了开发工具，而开发工具中也内置了编程、调试、开发环境、发布于一身，我们也不用再探讨它的最终运行环境了，只要按照官方文档进行开发就可以了。并且从微信团队给开发者提供开发工具这一举动，让我联想到了苹果给开发者提供的X-CODE开发工具，可以想象微信的“野心”可见一斑

       äºŒã€å¼€å‘成本的不同。

       è¿™é‡Œæˆ‘提出了一个问题，当我们面对一个HTML5 web开发需求时，我们需要考虑什么呢？抛去开发工具（vscode、sublimtext、Atom等）不谈，大到前端框架（Angular、react、vue、backbone等）、模块管理工具（Webpack 、Browserify 等）、任务管理工具（Grunt、Gulp等），小到UI库选择、接口调用工具（ajax、Fetch Api等）、浏览器兼容性等都要我们一一考略，再不济用jqery插件写H5，也要在开发过程中去寻找合适的jquery插件来配合项目。尽管这些工具可定制化非常高，并且提高了开发者的开发效率，但我相信项目开发的配置工作已经消耗了不少精力，尽管大部分开发者都有自己的配置模板，但长久以来对于项目中使用的各种外部库的版本迭代、版本升级所产生的成本应该也不低。

       è€Œå½“我们面对一个微信小程序的开发需求时，我们需要考虑什么呢？微信团队提供了开发者工具，并且规范了开发标准，前端常见的HTML、CSS变成了微信自定义的WXML、WXSS，WXML中尽管全部是自定义标签，但官方文档中都有明确的使用介绍，相信上手应该是非常容易的；WXSS、JSON和JS文件中的写法稍有限制，但整体相差不多。在统一了这些标准之后，作为一个开发者，你会发现，自己只要专注写程序就可以了：

       å½“需要调用后端接口时，调用发起请求API

       å½“需要上传下载时，调用上传下载API

       å½“需要数据缓存时，调用本地存储API

       å¼•å…¥åœ°å›¾ã€ä½¿ç”¨ç½—盘、调用支付、调用扫码等等功能都可以直接使用

       UI库方面，框架自然带有自家weui库加成

       å¹¶ä¸”在使用这些API时，你不用再去顾虑浏览器兼容性，不用担心生产环境中出现不可预料的奇妙BUG，可见微信小程序的开发成本确实相比以往的web开发低很多。

       ä¸‰ã€èŽ·å–系统级权限的不同。

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

       å››ã€åº”用在生产环境的运行流畅度。

       è¿™æ¡æ— è®ºå¯¹äºŽç”¨æˆ·è¿˜æ˜¯å¼€å‘者来说，都是最直观的感受。长久以来，当HTML5应用面对复杂的业务逻辑或者丰富的页面交互时，它的体验总是不尽人意，需要不断的对项目优化来提升用户体验。但是由于微信小程序运行环境独立，尽管同样用htmlcssjs去开发，但配合微信的解析器最终渲染出来的是原生组件的效果，自然体验上将会更进一步。请使用手机"扫一扫"x

Web前端开发主要学哪些？

       å‰ç«¯çŸ¥è¯†æ˜¯ä¸€ç§å¾ˆç«çš„技术，一直在编程语言中名列前茅，而且随着浏览器技术不断发展，还有会很多扩展的可能性，比如3D可视化，谷歌发布一个全新的图形工具TensorFlow Graphics，结合计算机图形学和计算机视觉技术，以无监督的方式解决复杂3D视觉任务，无疑谷歌浏览器也会支持3D图像，前端技术实现在线可视化开发，基于webgl的3D框架有thingjs，three.js。

       thingjs是这两年新兴的3D框架，更加简单，官网有注册优惠别错过~理论知识是基础，对于前端开发者来说，技术应用是进一步的需求，所以thingjs提供免费3D源码和3D模型库，让你在项目开发过程中有东风助力，在实操的过程中你会更好地吸收前端技术知识！

       å‰ç«¯æŠ€æœ¯è‚¯å®šä¸æ˜¯æœ€ç»ˆçš„目的，做成一个有价值的商业项目，才能让你更有成就感！