WEB前端线上平台事业部陈鑫均WEB前端前端简介前端技术流行框架前端工具前端简介前端是什么？HTML/CSS/JavaScript……与后端相比前端客户端环境不可预知代码开源数据无法隐藏更关注页面性能和用户体验前端简介前端主要职能：把网站界面更好的呈现给用户前端技术前端技术常见浏览器：浏览器的组成UserInterface用户界面，我们平时看到的浏览器BrowserEngine浏览器引擎，负责协调各个部分的工作RenderingEngine渲染引擎，解析页面结构和样式Networking网络，负责与服务器的数据交互JavascriptInterpreterjs解释器，解释执行js代码UIBackendUI后台，负责浏览器自带的UI功能，比如alert()等DataPersistence数据持久化，浏览器本地数据存储，例如cookie等前端技术W3C标准视觉/交互设计兼容性技术性能及安全前端技术W3C标准WEB三项组成：结构、表现、行为前端人员遵守的第一原则：“结构与表现分离”结构标准（HTML/XHTML/XML）表现标准（CSS）行为标准（JavaScript）前端技术结构标准HTML：超文本标记语言XML：可扩展标记语言XHTML：可扩展超文本标记语言简史：1989年，TimBerners-Lee发明HTML1998年2月，发布XML1.01999年12月，发布HTML4.01版本2000年1月，发布XHTML1.02014年10月底，HTML5标准规范制定完成W3C标准-结构标准前端技术HTML——WEB应用的基石HTML应用原则：语义化W3C标准-结构标准前端技术HTML——WEB应用的基石HTML标签（94个）文档：<html>、<head>、<body>、<title>、<meta>、<base>、<style>、<link>、<script>、<noscript>结构：<div>、<span>、<iframe>表格：<table>、<thead>、<tbody>、<tfoot>、<tr>、<td>、<th>、<col>、<colgroup>、<caption>表单：<from>、<input>、<textarea>、<button>、<select>、<optgroup>、<option>、<label>、<fieldset>、<legend>列表：<ul>、<ol>、<li>、<dl>、<dt>、<dd>文本：<a>、<i>、<b>、<big>、<small>、<em>、<strong>、<code>、<cite>、<sup>、<sub>文章：<h1>-<h6>、<p>、<br>、<pre>、<abbr>、<blockquote>、<q>、<ins>、<del>、<address>媒体：<img>、<map>、<area>、<object>、<param>特殊标签：<!DOCTYPE>、<!--—>、<hr>W3C标准-结构标准前端技术HTML——WEB应用的基石HTML5新增标签：W3C标准-结构标准sectionheaderarticleasidefootervideoaudioprogressrubycanvasnavtimemarkfigurefigcaption前端技术HTML——WEB应用的基石HTML4与HTML5结构区别W3C标准-结构标准前端技术表现标准CSS：层叠样式表简史：1994年HåkonWiumLie提出了CSS的最初建议1996年12月，发布CSS1.01998年5月，发布CSS2.01999年开始制订CSS3.02011年9月开始设计CSS4.0W3C标准-表现标准前端技术CSS——程序员的画笔W3c:margin、border、padding、content，并且content部分不包含其他部分IE：margin、border、padding、content但是content部分包含了border和paddingW3C标准-表现标准前端技术CSS——程序员的画笔CSS3.0重要模块选择器——新的伪类:last-child，属性选择器[att^=“value"]框模型——box-sizing背景和边框——多背景图，border-image，border-radius文本效果——text-shadow，@font-face属性2D/3D转换——transform动画——创建动画@keyframes，animation多列布局——column-count，column-gap，column-rule用户界面——调整元素尺寸resize……W3C标准-表现标准前端技术CSS——程序员的画笔优化你的CSS外部引入样式文件；尽量少使用子选择器；减少规则数量（3层）；csssprite技术；避免使用滤镜和表达式;……W3C标准-表现标准前端技术行为标准DOM：文档对象模型，定义了访问HTML和XML文档的标准，目前使用3.0版本ECMASCript：由Ecma国际通过ECMA-262标准化的脚本程序设计语言简史：1995年诞生，专用于客户端数据验证，叫LiveScript当时Java很火，为了推广，更名Javascript1996年，微软发布了自己的Javascript，叫JScript1997年，ECMA组织规定了Javascript的标准，叫ECMAScript，约束了js的语法和功能2003年，js被大量用于页面广告，被称为“牛皮癣”2004年，Google公司推出Ajax技术，拯救了Js2007年，移动端的出现让js更加得到重视2010年，H5推出，Canvas和Javascript的结合使用，让js功能更加强大2011年，nodejs的出现，让js前后端通吃W3C标准-行为标准前端技术JavaScriptJavaScript实现了网页实时的、动态的、可交互式得表达能力。语言特性：高阶函数可以将函数作为参数也可以返回函数动态类型延迟绑定可以赋给变量任意的值，并可以随时更改类型灵活的对象模型使用原型继承W3C标准-行为标准前端技术JavaScriptJavascript是一门客户端脚本语言运行在客户端（浏览器）边解释边执行Javascript是一种弱类型的动态语言对数据的类型要求不严格，在执行的时候才知道数据的类型可以动态地向结构中添加内容（属性和方法） W3C标准-行为标准前端技术JavaScript——WEB性能W3C标准-行为标准快速响应的界面减少DOM编程带来的性能损失优化Ajax性能前端技术JavaScript——WEB性能快速响应的界面：网页的UI渲染方式是单线程的尽量把js代码或文件放到页面底部异步载入WebWorkersHTML5新特性：WebWorkers为WEB前端网页上的脚本提供了一种能在后台进程中运行的方法；进程之间不会相互影响；除IE10以下，主流浏览器都提供原生支持；高启动性能成本和高进程内存成本，数量不宜过多。W3C标准-行为标准前端技术JavaScript——WEB性能减少DOM编程带来的性能损失减少Reflow/Repaint操作，尤其Reflow重绘Repaint——颜色、文本、字体、背景图变化等重排Reflow——页面渲染、窗口大小改变、布局变化、DOM结构变化等使用事件代理减少内存占用避免重复绑定减少事件绑定的处理时间参考：http://www.xue5.com/WebDev/JavaScript/672499.htmlhttp://www.cnblogs.com/silence516/archive/2009/09/03/delegateEvent.htmlW3C标准-行为标准前端技术JavaScript——WEB性能优化Ajax性能缓存数据1.在服务器端，设置HTTP头信息以确保你的响应会被浏览器缓存；2.在客户端，把获取到的信息存储到本地，从而避免再次请求。参考
书
关于书的成语关于读书的排比句社区图书漂流公约怎么写关于读书的小报汉书pdf
籍：《高性能Javascript》W3C标准-行为标准前端技术视觉/交互设计视觉设计又称UI（User-Inteface）设计。视觉设计是前端开发的基础技能，前端开发的一个重要意义就是通过代码呈给用户良好视觉体验的界面。需要了解WEB的排版艺术及交互艺术会使用Photoshop这类画图工具了解设计WEB应用的一些方法交互设计是设计人和物的对话，以设计和改善产品的有用性，易用性和吸引性为目的。前端技术兼容性技术Trident内核：IE6-IE11；Gecko内核：Firefox；Webkit内核：Safari、Chrome；双核/多核浏览器：遨游、360、百度、搜狗各大浏览器对W3C标准的支持程度不尽相同，在CSS样式、DOM操作、XML解析、创建异步通信对象等操作上存在很多兼容性问题。前端技术性能及安全网络安全：OWASP（OpenWebApplicationSecurityProject）开放式Web应用程序安全项目。网址：http://www.owasp.org.cn（中文站）。性能：基础原则（比如Yahoo得34条性能准则），性能检测工具（YSlow，PageSpeed，showslow）。页面内容优化服务器优化前端技术性能及安全性能——页面内容优化尽量减少HTTP请求次数1.合并文件2.CSSSprites3.剔除重复脚本减少交互通信1.压缩javascript和CSS文件2.优化图片，尽量减少存储大小3.减少Cookie体积4.使用外部javascript和CSS文件5.缓存Ajax数据6.剔除未用到的脚本和样式7.推迟加载内容8.使用GET来完成AJAX请求9.对于静态内容使用无cookie请求合理利用并行1.尽量避免重定向2.慎用iframe3.把样式表放在顶部4.脚本放到样式后面加载节约系统消耗1.避免使用CSS表达式2.避免使用滤镜前端技术性能及安全性能——服务器优化使用内容分发网络（CDN）配置合理的服务器端缓存机制Gzip压缩文件内容减少DNS查找次数流行框架1.angularJS2是一个用于设计动态web应用的结构框架。首先，它是一个框架，不是类库，是像EXT一样提供一整套
方案
气瓶 现场处置方案 .pdf气瓶 现场处置方案 .doc见习基地管理方案.doc关于群访事件的化解方案建筑工地扬尘治理专项方案下载
用于设计web应用。它不仅仅是一个javascript框架，因为它的核心其实是对HTML标签的增强特性一：双向的数据绑定特性二：
模板
个人简介word模板免费下载关于员工迟到处罚通告模板康奈尔office模板下载康奈尔 笔记本 模板 下载软件方案模板免费下载
特性三：MVC(Model-View-Controll)特性四：服务和依赖注入特性五：指令（Directives）流行框架2.VueJS(MVVM模式)Vue 是一套构建用户界面的渐进式框架,轻量高效的前端组件化方案Vue只关注视图层，采用自底向上增量开发的设计。Vue的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件。特性：简洁轻量快速数据驱动模块友好组件化 前端技术EcmaScript6（版本）新语法ECMAScript和JavaScript的关系是，前者是后者的规格，后者是前者的一种实现（另外的ECMAScript方言还有Jscript和ActionScript）。日常场合，这两个词是可以互换的。DefaultParameters（默认参数）inES6TemplateLiterals（模板文本）inES6Multi-lineStrings（多行字符串）inES6DestructuringAssignment（解构赋值）inES6ArrowFunctions（箭头函数）inES6Block-ScopedConstructsLetandConst（块作用域构造LetandConst）类似ECMAScript5的varClasses（类）inES6Modules（模块）inES6前端技术nodeJS简单的说Node.js就是运行在服务端的JavaScript。Node.js是一个基于ChromeJavaScript运行时建立的一个平台。Node.js是一个事件驱动I/O服务端JavaScript环境，基于Google的V8引擎，V8引擎执行Javascript的速度非常快，性能非常好。优点：1.异步I/O：2.事件与回调函数3.单线程4.跨平台前端工具设计类切图工具：photoshop，Fireworks…编辑器：Sublime，WebStorm，Hbuilder..调试类FirebugIETester前端工具IETester：多版本IE测试。thanks！
浙公网安备 33021202002483