Web前端的需要具备的核心技能_Web前端的有哪些核心技能

　　现在的网页制作都更接近传统的网站后台开发，所以现在不再叫网页制作，而是叫Web前端开发。下面由学习啦小编为大家整理的Web前端的核心技能，希望大家喜欢!

　　Web前端的核心技能

　　1.开发语言

　　HTML发展历史有二十多年，历经多次版本更新，HTML5和CSS3的出现又是一次革新。有些人认为前端开发要掌握的技能简单，不就是制作网页 嘛，其实不然，web前端需要掌握的核心语言xHTML+CSS+JavaScript，JavaScript作为最难的语言之一，许多编程高手也不敢妄 自菲薄自封精通。由于JavaScript与html的差异性，以及静动态分开处理的一些好处。在大公司编写静态效果和动态效果往往是分开由不同的人完成 的。小公司因为需要压缩成本，就要求每个人会的越多越好，如果您想往项目经理发展，能懂一两门后台语言，绝对是锦上添花!

　　2.浏览器兼容性

　　互联网目前主流浏览器有IE6，Firefox，Chrome，Opera，Safari，遨游，包括国内主流的搜狗，腾讯 TT，360，the World等等;从内核上讲主要有IE的，遨游版IE，safari，firefox以及opera的，这些都是大家常见的，如果你身边有老网虫喜欢收藏 浏览器，你翻翻他的硬盘，相信几十款肯定是有的。每种内核对代码的解析是不完全一样的，即使同样内核也可能存在很大差异，如IE和遨游版的IE。不说非主流的浏览器，就主流的浏览器要做到完全兼容，也并非易事，需要长时间的积累和测试，需要前端开发工程师对前端开发的热爱和激情。

　　目前移动互联网的发展趋势也不容小觑，将慢慢占据互联网的主要份额。移动互联网最突出的好处是方便和及时，试想一下，走在某地风景很好，拍下来后自 动分享给各路好友，因此手机上的浏览器兼容也看刻不容缓，现在手机上的浏览器也是纷繁复杂，主流的UCWEB，safari，IE，3G门户的，以及 symbian低端机的“残缺儿童”，包括国外流行手机我们不知道的一些浏览器，更糟糕的是这些浏览器解析因为手机硬件的不同，每个浏览器得到的结果都是 完全不同的。

　　3.hack技术

　　由于不同的浏览器对CSS的解析认识不一样，因此会导致生成的页面效果不一样，这个时候就需要针对不同的浏览器写不同的CSS，这个过程叫CSS hack。虽然我们写代码都要求按照标准，不写hack代码，但实际工作中为了兼容主流浏览器，hack代码是免不了的，所以这也应该是每个前端开发人员 必备的技能。

　　4.业内标准

　　目前Web前端开发中提到最多的就是W3C标准，这是一系列标准的集合，代表了互联网发展的方向，也代表了前端开发的一种信仰。写的代码都要100%通过标准验证，为通过标准验证而感到自豪，会有效推动互联网的快速发展。

　　5.开发工具

　　目前比较流行的是Dreamweaver， 其曾经风靡一时，到现在也没有退出历史舞台，证明DW还是有很大优势的，尤其是针对初学者，其强大的提示功能可以帮助我们很快的熟悉并掌握网页布局，但现在更提倡的是纯手写代码，既体现技能方面的卓越，也可有效避免使用DW等工具产生的冗余代码。此外再掌握一些photoshop技能，即使没有美工，也能简单处理一些图像。

　　Web前端的核心条件

　　第一，必须掌握基本的Web前端开发技术，其中包括：CSS、HTML、SEO、DOM、BOM、Ajax、JavaScript等，在掌握这些技术的同时，还要清楚地了解它们在不同浏览器上的兼容情况、渲染原理和存在的Bug。

　　第二，在一名合格的前端工程师的知识结构中，网站性能优化、SEO和服务器端的基础知识也是必须掌握的。

　　第三，必须学会运用各种工具进行辅助开发。

　　第四，除了要掌握技术层面的知识，还要掌握理论层面的知识，包括代码的可维护性、组件的易用性、分层语义模板和浏览器分级支持，等等。

　　可见，看似简单的网页制作，如果要做得更好、更专业，真的是不简单。这就是前端开发的特点，也是让很多人困惑的原因。如此繁杂的知识体系让新手学习起来无从下手，对于老手来说，也时常不知道下一步该学什么。

　　代码质量是前端开发中应该重点考虑的问题之一。例如，实现一个网站界面可能会有无数种方案，但有些方案的维护成本会比较高，有些方案会存在性能问题，而有些方案则更易于维护，而且性能也比较好。这里的关键影响因素就是代码质量。CSS、HTML、JavaScript这三种前端开发语言的特点是不同的，对代码质量的要求也不同，但它们之间又有着千丝万缕的联系。

　　Web 前端性能优化

　　1.浏览器访问渲染优化

　　减少 http 请求数

　　http 协议是无状态的应用层协议，每次 http 请求都会建立新的通信链路，并且在服务端，每个 http 连接都会开启一个单独的线程去处理请求，这都会产生额外的开销

　　主要手段就是去合并压缩 css，JavaScript，图片文件，把需要的 css，JavaScript，图片资源进行合并减少建立的连接请求数

　　同时使用 http 的 keep-alive 来进行连接的复用，以此来减少建立的 http 连接数，提高访问性能

　　启用压缩

　　在服务端进行文件的压缩，减少通信传输过程中的数据量

　　对于文本文件，压缩率能够达到 80% 以上，因此在服务端启用 gzip 压缩是一个很好的选择，但启用压缩的同时也会给服务器带来额外的开销，所以要具体情况具体分析

　　2.css，JavaScript 代码优化

　　css 代码优化：

　　尽量使用外部样式，并且放在页面顶部加载，一方面能够及时渲染，另一方面能够避免因某些样式导致阻塞渲染

　　压缩合并 css 文件，尽量精简文件，减少通信传输数据量和请求连接数

　　JavaScript 代码优化：

　　因为 JavaScript 代码边加载边解析，解析的过程会阻塞浏览器渲染，因此把 JavaScript 代码放在页面底部加载

　　同样的压缩合并 JavaScript 文件，尽量精简文件，减少通信传输数据量和请求连接数

　　3.写高性能的 JavaScript 代码

　　使用浏览器缓存

　　一般来说，对于网站里面不经常变化的静态资源，更新频率比较低，因此可以把这些资源缓存在浏览器中，能够很好的改善性能

　　通过设置 http 头里的 Cache-Control 和 Expires 属性来设定浏览器缓存时间

　　另外还有 Etags 和 opcode 的缓存，根据具体情况进行选择吧

　　CDN 加速

　　CDN 的本质也属于缓存，内容分发网络，把数据缓存在里用户近的地方，使用户尽快的获取数据

　　因为 CDN 都是部署在网络运营商的机房，这些运营商又同时为用户提供网络服务，因此用户请求的路由会优先到达 CDN 服务器，如果存在请求的资源的话，就直接返回，最短路径返回响应，加速用户访问速度，同时还能够为中心机房减轻压力

　　CDN 一般用来缓存静态资源，css，Script 脚本，静态页面，图片等，这些内容修改频率很低但是访问请求频率很高，因此放在 CDN上能够很好的改善访问速度

　　4.反向代理

　　传统的代理服务器是当你请求不到所请求的资源时，由代理服务器帮你请求，你知道你请求的最终的服务器是谁，典型的例子就是VPN，通过代理服务器来请求到墙外的世界

　　而反向代理是当你请求一个地址时，你请求的是反向代理服务器，然后由反向代理服务器去请求其他服务器来获取内容，而你不知道最终是从哪一台服务器获取到的数据

　　反向代理 web 服务器接收 http 请求，然后进行请求转发，获取到内容后返回给你，你只知道是由反向代理服务器给你的数据，而不知道数据源最终是从哪个服务器来的

　　反向代理服务器具有保护作用，来自互联网的请求都需要经过反向代理服务器，相当于在 web 服务器之间建立起了一道屏障

　　除了安全以外，可以在反向代理服务器上进行一些静态资源的缓存，以此来提高访问速度，减轻应用服务器的负载压力

　　当然，有些动态资源也可以缓存在代理服务器上面，比如说热门的词条，帖子，博客等，这些资源的请求量可能非常非常的大，如果每次都走一遍流程的话会造成很大的压力，同时，当这些动态内容发生改变时，会通知反向代理服务器缓存失效，代理服务器会重新缓存动态资源