主讲人李松风360前端技术专家奇舞团主要内容：web标准概述web标准介绍web标准概述Web是WorldWideWeb（万维网）的简称。WorldWideWeb由TimBerners-Lee在1989年发明。Web标准是构成Web基础、运行和发展的一系列标准的总称。Web标准并不是由一家标准组织制定。Web标准介绍http发展：IETFInternetEngineringTaskForceIT成

前端工程化主讲人田东东360前端技术专家奇舞团一、什么是前端工程化？目标技术原因目标：在前端领域，利用不断进步经验积累带来的各种方案，来解决在项目中的开发测试维护阶段遇到的种种抵消和繁琐的问题各种工具如下：⼯程化里的技术⼯程化是⼀种思想，技术是⼀种实践。技术会随着时代进步不断地演进和改变，在不同的时期，都会有不同的技术来承载和践⾏着⼯程化思想。思想的落地离不开⾏动和实践，技术虽然会过时，但是实践必

主讲人：孙磊一、如何衡量代码质量的好坏衡量代码质量的唯一有效标准：WTF/min——RobertC.Martin代码的自我修养代码规范格式流程化二、代码规范yarnglobaladdeslint{"extends":"eslint:recommended","rules":{//enableadditionalrules"indent":["error",4],"linebreak-style":

主讲人：胡尊杰一、什么是视频了解媒体数据存储和应用的基础原理。格式与内容文件扩展名≈媒体封装格式(媒体容器类型)媒体封装格式≠音视频编码格式(使用了谁家的编码器)文件内容：1)头信息(格式、时长、帧率、码率、分辨率…)2)索引信息3)视频数据4)音频数据5)附加增强数据…视频数据显示器颜色呈现基于RGB(红绿蓝)颜色空间模型视频领域大多基于YUV颜色空间做抽样存储帧内预测&帧间预测复用进一步有效的

主讲人：吴亮一、动画动画的基本原理定时器改变对象的属性根据新的属性重新渲染动画functionupdate(context){//更新属性}constticker=newTicker();ticker.tick(update,context);动画的种类JavaScript动画操作DOMCanvasCSS动画transitionanimationSVG动画SMILJS动画的优缺点优点：灵活度、可控

主讲人饶占平360大前端团队奇舞团前端工程师一、RALL模型使用RALL模型评估性能RALL模型：以用户为中心的性能模型，每个网络应用都具有与生命周期有关的四个方面，而且这些方面以不同的方式影响着性能。延迟与用户反应响应：50ms处理事件目标：在100ms内响应用户输入指导50ms内处理用户输入事件，确保100ms内反馈用户可视的响应。对于开销大的任务可分隔任务处理，或放到worker进程中执行，

主讲人刘观宇360奇舞团PC小程序框架一、简介⼩程序解决了什么问题H5：开发速度较快，各个平台的一致性较好，执行起来会有较长的白屏时间，对于系统接口访问有局限。APP：体验上优势较大，开发成本较高，各个平台会有较大的差异。小程序：相对于H5，小程序除第一次加载，小程序的layout和资源均从本地运行，不经过网络，大大提高了启动速度，减少了白屏加载时间，小程序代码经过审核，宿主APP可以比较放心的把

主讲人：李喆明一、什么是Node.jsNode.js：Node.js®isaJavaScriptruntimebuiltonChrome’sV8JavaScriptengine.https://nodejs.org与JavaScript的区别基于异步I/O相关接口基于node_modules和require的模块依赖提供C++addonAPI与系统交互Node.js可以干什么？Web服务端：Web

主讲人：李成银一、HTTPHTTP在浏览器网络中的位置HTTP是应用层协议联网细节交给了通用的传输协议：TCP/UDP3.请求/响应报文请求：返回：请求类型状态码常见状态码URL受限字符：%/.#?;:$+@&=以及非US-ASCⅡ字符集字符://:@:/;?#http://:/?#ftp://:@:/;Header分类1）通用Date:Tue,3Oct201902:16:00GMTConnect

主讲人田东东燕山大学硕士研究生360搜索前端团队首届前端星计划毕业生一、什么是前端工程化？⼯程化的目标在前端领域，利用技术不断进步和经验逐步积累带来的各种⽅案，来解决在项目的开发、测试、维护阶段中遇到的种种低效和繁琐的问题。⼯程化里的技术⼯程化是⼀种思想，技术是⼀种实践。技术会随着时代进步不断地演进和改变，在不同的时期，都会有不同的技术来承载和践⾏着⼯程化思想。思想的落地离不开⾏动和实践，技术虽然

主讲人：李松峰一、Web标准概述Web是WorldWideWeb（万维网）的简称。WorldWideWeb由TimBerners-Lee在1989年发明。Web标准：是构成Web基础、运行和发展的一系列标准的总称。Web标准并不是由一家标准组织制定。二、Web标准介绍IETF（互联网工程任务组）：HTTP/0.9：最简单的通信协议，只有GET方法；https://www.w3.org/Protoc

主讲人：王峰一、正则表达式的创建和使用创建正则表达式的两种方式1）使用正则表达式字面量[a-z]：小写字母a-z；\d：0-9+：限定符，限定\d重复一次到多次；i：修饰符，忽略大小写；constreg=/[a-z]\d+[a-z]/i;优点简单方便不需要考虑二次转义缺点子内容无法重复使用（[a-z]用两次写两次）过长的正则导致可读性差2）使用RegExp构造函数constalphabet='[a

主讲人赵文博360前端技术专家奇舞团一、选择器的特异度(Specificity)提出问题：哪条规则生效？拉森火山国家公园.title{color:blue;}articleh1{color:red;}解决问题：选择器的特异度(Specificity)可以看成122>22，所以第一个选择器的优先级更高。高优先级选择器会覆盖低优先级选择器相同属性的值，可以利用此特性实现CSS代码的复用。公共的样式复用

主讲人赵文博360前端技术专家奇舞团一、什么是前端解决GUI人机交互问题跨终端PC/移动浏览器客户端VR/AR等Web技术栈二、前端技术栈JavaScript（行为）CSS（样式）HTML（内容）JavaScript、CSS、HTML运行在浏览器中，通过http协议与服务器端通信，获取前端代码渲染页面，浏览器也可以把用户填写的内容通过HTTP协议，提交到服务器。三、前端应该关注哪些方面？功能（核心

主讲人：月影思考：如何写“好”JavaScript——前端工程师的最佳实践套路模式什么才是好的JS代码？一、各司其职JavaScript：行为CSS：表现HTML：结构尽量做到职责分离关灯吃面：版本1黑夜与白天的切换HTML代码：今天回到家，煮了点面吃，一边吃面一边哭，泪水滴落在碗里，没有开灯。CSS代码：html,body{margin:0;padding:20px;width:100%;hei

主讲人赵文博360前端技术专家奇舞团一、CSS是什么CascadingStyleSheets用来定义页面元素的样式设置字体和颜色设置位置和大小添加动画效果h1{/*选择器*/color:white;/*color：属性white：属性值*/font-size:14px;/*font-size:14px;声明（Declaration）*/}二、在页面中使用CSS外链（推荐）：利于维护。嵌入内联（不推

主讲人赵文博360前端技术专家奇舞团一、transform变形对元素进行平移、旋转、缩放、倾斜translaterotatescaleskewtransform不会对其它元素布局产生影响transform：translate实现旋转：rotate缩放：scaletransform：skewX3D变形：近大远小二、transition过渡指定从一个状态到另一个状态时如何过渡动画的意义：告诉用户发生了

第六届360前端星计划上上周在云端顺利完成！受疫情影响，今年的星计划只能在线上进行，参加星计划的学生在线上课，所有课程均已录制好在奇舞学院学习。

第六届360前端星计划已经在线开课啦！！！小编今天看到了星计划同学们昨天的学习笔记，想把看到的部分比较优秀的笔记分享给大家，希望我们能不断进步，在前端学习的道路上一起（手拉手[想啥呢]）向前走。

Day1第六届360前端星计划_HTML与前端第六届360前端星计划_了解CSS第六届360前端星计划_深入CSS第六届360前端星计划_CSS进阶Day2第六届360前端星计划_JavaScript从入门到放弃第六届

主讲人李成银360前端技术专家奇舞团浏览器在网页中的位置http在浏览网页中位值.PNG请求过程http协议.PNGHTTP是应用层协议联网细节交给了通用的传输协议：TCP/UDPhttp格式：头信息，请求头和响应头response：页面内容格式简单请求格式：响应格式请求类型：请求类型描述GET获取一个资源内容POST新增一个资源PUT更新资源内容DELETE删除资源OPTIONS根据返回判断是否

前端性能优化主讲人饶占平360前端技术专家奇舞团分为三部分：RAIL模型定义标准工具篇实践篇RAIL模型评估性能以用户为中心的性能模型，每个网络应用语气声明周期有关的四个部分，而且这些方面以不同的方式影响性能。responseanimationidleload评估影响用户体验因素也是这4个rail模型从内容上分为：指导推荐的性能评估标准；性能评估标准，往往依赖于硬件，随时间改变目标倾向恒定指标，人

JS动画原理与实现主讲人吴亮360前端技术专家奇舞团动画动画的基本原理:定时器改变对象的属性根据新的属性重新渲染动画functionupdate(context){//更新属性}constticker=newTicker();ticker.tick(update,context);动画的种类:JavaScript动画操作DOMCanvasCSS动画transitionanimationSVG动画S

正则的三个应用场景主讲人王峰360前端技术专家奇舞团正则表达式的创建和使用三个应用场景正则与数值正则与颜色正则与URL正则表达式的创建和使用正则表达式的表示：使用正则表达式字面量constreg=/[a-z]\d+[a-z]/i;优点简单方便不需要考虑二次转义缺点子内容无法重复使用过长的正则导致可读性差使用RegExp构造函数constalphabet='[a-z]';constreg=newRe

主讲人月影360前端技术专家奇舞团各司其职关灯吃面例子：版本一light.onclick=function(evt){if(light.style.backgroundColor!=='green'){document.body.style.backgroundColor='#000';document.body.style.color='#fff';light.style.backgroundC