前端⾯试校招问题准备（总结）
前端点⼤⽽驳杂，⾯试前的准备往往会感到⽆所适从。在web开发的中，六项基础知识还是新⼿所必须掌握的：
HTML、CSS、JavaScript、移动Web开发、调试、HTTP⽹络知识。
HTML
1.常⽤的meta头；
2.通过你对标签语义化的理解来判断你能否写出更规范的HTML代码；
3.HTML5新增的能⼒；
4.HTML的渲染解析知识，⽐如为什么CSS放前⾯JS放后⾯，怎么理解并⾏加载串⾏执⾏
<!-- 字体编码 -->
<meta charset="utf-8"/>
<!-- 关键字 -->
<meta name="keywords" content=""/>
<!-- 说明 -->
<meta name="description" content=""/>
<!-- 作者 -->
<meta name="author" content=""/>
<!-- 设置⽂档宽度、是否缩放 -->
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>
<!-- 优先使⽤IE最新版本或chrome -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<!-- 360读取到这个标签⽴即钱换到极速模式 -->
<meta name="renderer" content="webkit"/>
<!-- 禁⽌百度转码 -->
<meta http-equiv="Cache-Control" content="no-siteapp"/>
<!-- UC强制竖屏 -->
<meta name="screen-orientation" content="portrait"/>
<!-- QQ强制竖屏 -->
<meta name="x5-orientation" content="portrait"/>
<!-- UC强制全屏 -->
<meta name="full-scerrn" content="yes"/>
<!-- QQ强制全屏 -->
<meta name="x5-fullscreen" content="ture"/>
<!-- QQ应⽤模式 -->
<meta name="x5-page-mode" content="app"/>
<!-- UC应⽤模式 -->
<meta name="browsermode" content="application">
<!-- window phone 点亮⽆⾼光 -->
<meta name="msapplication-tap-highlight" content="no"/>
<!-- 安卓设备不⾃动识别邮件地址 -->
<meta name="format-detection" name="email=no"/>
HTML书写规范
1. ⽂档类型声明及编码: 统⼀为html5声明类型<!DOCTYPE html>; 编码统⼀为<meta charset=”gbk” />, 书写时利⽤IDE实现层次分明的缩进;
2. ⾮特殊情况下样式⽂件必须外链⾄<head>…</head>之间;⾮特殊情况下JavaScript⽂件必须外链⾄页⾯底部;
3. 引⼊样式⽂件或JavaScript⽂件时, 须略去默认类型声明, 写法如下:
<link rel=”stylesheet” href=”…” />
<style>…</style>
<script src=”…”></script>
4. 引⼊JS库⽂件, ⽂件名须包含库名称及版本号及是否为压缩版, ⽐如jquery-1.4.1.min.js; 引⼊插件, ⽂件名格式为库名称+插件名称, ⽐如kie.js;
5. 所有编码均遵循xhtml标准, 标签 & 属性 & 属性命名必须由⼩写字母及下划线数字组成, 且所有标签必须闭合, 包括 br (<br />), hr(<hr />)等; 属性值必须⽤双引号包括;
6. 充分利⽤⽆兼容性问题的html⾃⾝标签, ⽐如span, em, strong, optgroup, label，等等;
需要为html元素添加⾃定义属性的时候, ⾸先要考虑下有没有默认的已有的合适标签去设置, 如果没有,
可以使⽤须以”data-”为前缀来添加⾃定义属性，避免使⽤”data:”等其他命名⽅式;
7. 语义化html, 如标题根据重要性⽤h*(同⼀页⾯只能有⼀个h1), 段落标记⽤p, 列表⽤ul, 内联元素中不
可嵌套块级元素;
8. 尽可能减少div嵌套, 如<div><div class=”welcome”>欢迎访问XXX,
您的⽤户名是<div
class=”name”>⽤户名</div></div></div>完全可以⽤以下代码替代:
<div><p>欢迎访问XXX,
您的⽤户名是<span>⽤户名</span></p></div>;
9. 书写链接地址时, 必须避免重定向，例如：href=”itaolun/”, 即须在URL地址后⾯加上“/”；
10. 在页⾯中尽量避免使⽤style属性，即style=”…”;11. 必须为含有描述性表单元素(input, textarea)添加label, 如<p>姓名: <input
type=”text” id=”name” name=”name” /></p>须写成:<p><label
for=”name”>姓名: </label><input type=”text” id=”name”
/></p>
12. 能以背景形式呈现的图⽚, 尽量写⼊css样式中;
13. 重要图⽚必须加上alt属性; 给重要的元素和截断的元素加上title;
14. 给区块代码及重要功能(⽐如循环)加上注释, ⽅便后台添加功能;
15. 特殊符号使⽤: 尽可能使⽤代码替代: ⽐如<(<) & >(>) & 空格( ) & »(») 等等;
16. 书写页⾯过程中, 请考虑向后扩展性;
H5新增标签
1、结构标签
（1）section：独⽴内容区块，可以⽤h1~h6组成⼤纲，表⽰⽂档结构，也可以有章节、页眉、页脚或页眉的其他部分；
（2）article：特殊独⽴区块，表⽰这篇页眉中的核⼼内容；
（3）aside：标签内容之外与标签内容相关的辅助信息；
（4）header：某个区块的头部信息/标题；
（5）hgroup：头部信息/标题的补充内容；
（6）footer：底部信息；
（7）nav：导航条部分信息
（8）figure：独⽴的单元，例如某个有图⽚与内容的新闻块。
2、表单标签
（1）email：必须输⼊邮件；
（2）url：必须输⼊url地址；
（3）number：必须输⼊数值；
（4）range：必须输⼊⼀定范围内的数值；
（5）Date Pickers：⽇期选择器
（6）search：搜索常规的⽂本域；
（7）color：颜⾊；
3、媒体标签
（1）video：视频
（2）audio：⾳频
（3）embed：嵌⼊内容（包括各种媒体），Midi、Wav、AU、MP3、Flash、AIFF等。
3、媒体标签
（1）video：视频
（2）audio：⾳频
（3）embed：嵌⼊内容（包括各种媒体），Midi、Wav、AU、MP3、Flash、AIFF等。
H5新增属性
（1）对于js进⾏添加的属性
<script defer src=".....js" onload="alert('a')"></script>
<script async src=".....js" onload="alert('b')"></script>
异步加载先出现b再出现a。
（2）⽹页中标签中加⼊⼩图标的样式代码
有序列表ol：新增start（列表起始值），reversed（是否倒置）menu菜单type属性（3个菜单类型）内嵌css样式：在标签内部来定义⼀个样式区块（scoped），只对样式标签内部才有效内嵌框架：iframe元素，新增了seamless⽆边距⽆边框，srcdoc定总结新增属性：
manifest属性：
定义页⾯需要⽤到的离线应⽤⽂件，⼀般放在<html>标签⾥
charset属性：
meta属性之⼀，定义页⾯的字符集
sizes属性：
<link>新增属性，当link的rel="icon"时，⽤以设置图标⼤⼩
base属性:
<base href="localhost/" target="_blank">表⽰当在新窗⼝打开⼀个页⾯时，会将href中的内容作为前缀添加到地址前
defer属性：
script标签属性，表⽰脚本加载完毕后，只有当页⾯也加载完毕才执⾏（推迟执⾏）
async属性：
script标签属性，脚本加载完毕后马上执⾏（运⾏过程中浏览器会解析下⾯的内容），即使页⾯还没有加载完毕（异步执⾏）
media属性：
<a>元素属性：表⽰对何种设备进⾏优化
hreflang属性：
<a>的属性，表⽰超链接指向的⽹址使⽤的语⾔
ref属性：
<a>的属性，定义超链接是否是外部链接
reversed属性:
<ol>的属性，定义序号是否倒叙
start属性：
<ol>的属性，定义序号的起始值
scoped属性：
内嵌CSS样式的属性，定义该样式只局限于拥有该内嵌样式的元素，适⽤于单页开发
HTML渲染过程
解析渲染该过程主要分为以下步骤：
（1）解析HTML
（2）构建DOM树
（3）DOM树与CSS样式进⾏附着构造呈现树
（4）布局
（5）绘制
浏览器的实际⼯作是将解析和构建DOM放在⼀起进⾏的。对于HTML浏览器有专门的html解析器来解析HTML，并在解析的过程中构建DOM树。在这⾥我们讨论两种DOM元素的解析，即样式（link、style）与脚本⽂件（script）。由于浏览器采⽤ 1）外部样式会阻塞后续脚本执⾏，直到外部样式加载并解析完毕。
2）外部样式不会阻塞后续外部脚本的加载，但会阻塞外部脚本的执⾏。
3）如果后续外部脚本含有async属性（IE下为defer），则外部样式不会阻塞该脚本的加载与执⾏
4）对于动态创建的link标签不会阻塞其后动态创建的script的加载与执⾏，不管script标签是否具有async属性，但对于其他⾮动态创建的script，以上三条结论仍适⽤
link或style标签都会被解析成DOM节点。浏览器对于样式表还会⽣成CSSStyleSheet对象(C++代码)
html解析完毕，DOM树创建完成后DOMContentLoaded事件即触发，这时候可以⽤过script来操作DOM节点。
padding是外边距还是内边距HTML解析完毕后，开始构建呈现树RenderTree，这⼀步的主要⼯作在于将css样式应⽤到DOM节点上，WebKit内核将这⼀过程称为附着，其他浏览器有不同的概念。对前端⼯程师⽽⾔这个过程会涉及到CSS层叠问题。
⾸先将根据样式重要性排序，由低到⾼依次为：
（1）浏览器声明
（2）⽤户普通声明
（3）作者普通声明
（4）作者重要声明
（5）⽤户重要声明
呈现树的每⼀个节点即为与其相对应的DOM节点的CSS框，框的类型与DOM节点的display属性有关，block元素⽣成block框，inline元素⽣成inline框。每⼀个呈现树节点都有与之相对应的DOM节点，但DOM节点不⼀定有与之相对应的呈现树节点呈现树构造完成后浏览器便进⾏布局处理，及计算每个呈现树节点的⼤⼩和位置信息。有道友可能要问，前⾯已将样式附着到DOM节点上，不是已经有了样式信息为何还要计算⼤⼩。这⾥可以这样理解，以上包含⼤⼩的样式信息只是存在内存⾥，并
布局完成后，便是将呈现树绘制出来显⽰在屏幕上。对于每⼀个呈现树节点来说，主要绘制顺序如下：
背景颜⾊
背景图⽚
边框
⼦呈现树节点
轮廓
CSS
1.怎样写出更好的CSS，如层级不宜过深，如何时⽤ID和何时⽤class，如怎么拆分组织CSS代码等;
2.盒模型；
3.⾮常常⽤的CSS3知识，⽐如CSS3动画，⽐如弹性布局。
css盒⼦模型概念
CSS css盒⼦模型⼜称框模型 (Box Model) ，包含了元素内容（content）、内边距（padding）、边框（border）、外边距（margin）⼏个要素。如图：
图中最内部的框是元素的实际内容，也就是元素框，紧挨着元素框外部的是内边距padding，其次是边框（border），然后最外层是外边距（margin），整个构成了框模型。通
常我们设置的背景显⽰区域，就是内容、内边距、边框这⼀块范围。⽽外边距margin是透明的，不会遮挡周边的其他元素。
元素框的总宽度 = 元素（element）的width + padding的左边距和右边距的值 + margin的左边距和右边距的值 + border的左右宽度；
元素框的总⾼度 = 元素（element）的height + padding的上下边距的值 + margin的上下边距的值＋ border的上下宽度。
css弹性布局概念
引⼊弹性盒布局模型的⽬的是提供⼀种更加有效的⽅式来对⼀个容器中的条⽬进⾏排列、对齐和分配空⽩空间。即便容器中条⽬的尺⼨未知或是动态变化的，弹性盒布局模型也
能正常的⼯作。在该布局模型中，容器会根据布局的需要，调整其中包含的条⽬的尺⼨和顺序来最好地填充所有可⽤的空间。当容器的尺⼨由于屏幕⼤⼩或窗⼝尺⼨发⽣变化
时，其中包含的条⽬也会被动态地调整。⽐如当容器尺⼨变⼤时，其中包含的条⽬会被拉伸以占满多余的空⽩空间；当容器尺⼨变⼩时，条⽬会被缩⼩以防⽌超出容器的范围。
弹性盒布局是与⽅向⽆关的。在传统的布局⽅式中，block 布局是把块在垂直⽅向从上到下依次排列的；⽽ inline 布局则是在⽔平⽅向来排列。弹性盒布局并没有这样内在的⽅
向限制，可以由开发⼈员⾃由操作。
从图中可以看到，弹性盒布局中有两个互相垂直的坐标轴：⼀个称之为主轴（main axis），另外⼀个称之为交叉轴（cross axis）。主轴并不固定为⽔平⽅向的 X 轴，交叉轴也不固定为垂直⽅向的 Y 轴。在使⽤时，通过 CSS 属性声明⾸先定义主轴的⽅向（⽔平或垂直），则交叉轴的⽅向也相应确定下来。容器中的条⽬可以排列成单⾏或多⾏。主轴确定了容器中每⼀⾏上条⽬的排列⽅向，⽽交叉轴则确定⾏本⾝的排列⽅向。可以根据不同的页⾯设计要求来确定合适的主轴⽅向。有些容器中的条⽬要求从左到右⽔平排列，则主轴应该是⽔平⽅向的；⽽另外⼀些容器中的条⽬要求从上到下垂直排列，则主轴应该是垂直⽅向的。
确定主轴和交叉轴的⽅向之后，还需要确定它们各⾃的排列⽅向。对于⽔平⽅向上的轴，可以从左到右或从右到左来排列；对于垂直⽅向上的轴，则可以从上到下或从下到上来排列。对于主轴来说，排列条⽬的起始和结束位置分别称为主轴起始（main start）和主轴结束（main end）；对于交叉轴来说，
排列⾏的起始和结束位置分别称为交叉轴起始（cross start）和交叉轴结束（cross end）。在容器进⾏布局时，在每⼀⾏中会把其中的条⽬从主轴起始位置开始，依次排列到主轴结束位置；⽽当容器中存在多⾏时，会把每⼀⾏从交叉轴起始位置开始，依次排列到交叉轴结束位置。
对于弹性盒布局的容器，使⽤"display: flex"声明使⽤弹性盒布局。CSS 属性声明"flex-direction"⽤来确定主轴的⽅向，从⽽确定基本的条⽬排列⽅式，有row、row-reserve、column、column-reserve。
默认情况下，弹性盒容器中的条⽬会尽量占满容器在主轴⽅向上的⼀⾏。当容器的主轴尺⼨⼩于其所有条⽬总的主轴尺⼨时，会出现条⽬之间互相重叠或超出容器范围的现象。CSS 属性"flex-wrap"⽤来声明当容器中条⽬的尺⼨超过主轴尺⼨时应采取的⾏为。
JavaScript
(1)事件模型
(2)闭包
(3)原型链
事件模型
javascript中有两种事件模型：DOM0，DOM2。
DOM0级事件模型是早期的事件模型，所有的浏览器都是⽀持的，⽽且其实现也是⽐较简单。
DOM2级事件模型
事件捕获和事件冒泡
注册事件和解除事件
在DOM2级中使⽤addEventListener和removeEventListener来注册和解除事件（IE8及之前版本不⽀持）。这种函数较之之前的⽅法好处是⼀个dom对象可以注册多个相同类型的事件，不会发⽣事件的覆盖，会依次的执⾏各个事件函数。
闭包
当function⾥嵌套function时，内部的function可以访问外部function⾥的变量。
但，这还不是闭包。当你return的是内部function时，就是⼀个闭包。内部function会close-over外部function的变量直到内部function结束。
function foo(x) {
var tmp = 3;
return function (y) {
alert(x + y + (++tmp));
}
}
var bar = foo(2); // bar 现在是⼀个闭包
bar(10);
实际上闭包概念就是为了避免内存泄露⽽存在的，闭包重点（或者意义）就是理解js的作⽤域，理解了作⽤域⽅能更主观的避免内存泄露，好⼀点的教程都会将闭包跟作⽤域联系在⼀起。
原型链
JS在创建对象（不论是普通对象还是函数对象）的时候，都有⼀个叫做__proto__的内置属性，⽤于指向创建它的函数对象的原型对象prototype。以上⾯的例⼦为例：console.log(zjh.__proto__ === person.prototype) //true
同样，person.prototype对象也有__proto__属性，它指向创建它的函数对象（Object）的prototype
console.log(person.prototype.__proto__ === Object.prototype) //true
继续，Object.prototype对象也有__proto__属性，但它⽐较特殊，为null
console.log(Object.prototype.__proto__) //null
我们把这个有__proto__串起来的直到Object.prototype.__proto__为null的链叫做原型链。
移动Web开发
(1)移动Web开发和PC Web开发有何不同？此题考察你对移动Web开发的整体理解，同时看你能否有组织有条理地思考问题；
(2)怎么实现响应式布局？考察你是否了解常见的布局⽅案；
(3)移动端的⼿势和事件；
(4)怎么提⾼移动端页⾯的渲染性能？针对移动端⽹络，考察你是否能从减少HTTP请求出发提出解决⽅案，是否了解GPU渲染（偏进阶）等；
PC端有ie、chrome、ff内核兼容问题移动端，简单来说兼容问题相对较少，但是移动端要做好多分辨率的处理，移动端所有图⽚和所有html标签的尺⼨都要减半。
PC端最常⽤的就是固定宽度980px，然后⽔平居中，移动端不能这么做，因为考虑到横竖屏和分辨率不⼀的问题。只要牵涉到移动端，就要牵涉到响应式（也叫做⾃适应）；如果只针对移动端的项⽬，主要考虑的是320px到750px宽的兼容。移动端相⽐于PC端多了触摸、滑动，减少了⿏标悬停、点击等事件。
⼿机浏览器可能不兼容CSS3的属性，可以⽤⼀下代码来加强你代码的健壮性。
（1）@media screen and (max-width:355px)宽度⼩于355px
（2）width:95%
width:calc(100%-10px);
width:-webkit-calc(100%-10px);
width:-moc-calc(100%-10px);
常见的布局⽅案
1、静态布局（Static Layout）
即传统Web设计，对于PC设计⼀个Layout，在屏幕宽⾼有调整时，使⽤横向和竖向的滚动条来查阅被遮掩部分；意思就是不管浏览器尺⼨具体是多少，⽹页布局就按照当时写代码的布局来布置；对于移动设备，单独设计⼀个布局，使⽤不同的域名如wap.或m.。
2、弹性布局
弹性布局是CSS3引⼊的强⼤的布局⽅式，⽤来替代以前Web开发⼈员使⽤的⼀些复杂⽽易错hacks⽅法（如使⽤float进⾏类似流式布局）。
其中flex-flow是flex-direction和flex-wrap属性的简写⽅式，语法如下：
flex-flow: <flex-direction> || <flex-wrap>
flex-direction: row（初始值） | row-reverse | column | column-reverse
flex-wrap: nowrap（初始值） | wrap | wrap-reverse
flex-direction定义了弹性项⽬在弹性容器中的放置⽅向，默认是row，即⾏内⽅向（⼀般⽽⾔是由左往右，但注意这个和书写模式有关）。
flex-wrap定义是否需要拆⾏以使得弹性项⽬能被容器包含。*-reverse代表相反的⽅向。
两者结合起来即flex-flow属性就确定了弹性容器在main axis和cross axis两个⽅向上的显⽰⽅式
3、⾃适应布局（Adaptive Layout）
⾃适应布局（Adaptive）的特点是分别为不同的屏幕分辨率定义布局。布局切换时页⾯元素发⽣改变，但在每个布局中，页⾯元素不随窗⼝⼤⼩的调整发⽣变化。你可以把⾃适应布局看作是静态布局的⼀个系列。就是说你看到的页⾯，⾥⾯元素的位置会变化⽽⼤⼩不会变化。
4、流式布局
流式布局（Liquid）的特点（也叫”Fluid”) 是页⾯元素的宽度按照屏幕进⾏适配调整，主要的问题是如
果屏幕尺度跨度太⼤，那么在相对其原始设计⽽⾔过⼩或过⼤的屏幕上不能正常显⽰。你看到的页⾯，元素的⼤⼩会变化⽽位置不会变化——这就导致如果屏幕太⼤或者太⼩都会导致元素⽆法正常显⽰。
5.响应式布局（Responsive Layout）
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
name="viewport"
名称=视图
width=device-width
页⾯宽度=设备宽度(可以理解为获取你⼿机的屏幕宽度)
initial-scale - 初始的缩放⽐例
minimum-scale - 允许⽤户缩放到的最⼩⽐例
maximum-scale - 允许⽤户缩放到的最⼤⽐例
user-scalable - ⽤户是否可以⼿动缩放
分别为不同的屏幕分辨率定义布局，同时，在每个布局中，应⽤流式布局的理念，即页⾯元素宽度随着窗⼝调整⽽⾃动适配。可以把响应式布局看作是流式布局和⾃适应布局设计理念的融合。每个屏幕分辨率下⾯会有⼀个布局样式，同时位置会变⽽且⼤⼩也会变。
移动端前端常见的触摸相关事件touch、tap、swipe等整理
1.click事件
单击事件，类似于PC端的click，但在移动端中，连续click的触发有200-300ms的延迟。
触摸事件，有touchstart touchmove touchend touchcancel四种之分。
3.tap事件
触碰事件，⼀般⽤于代替click事件，有tab/long tab/single tap/double tab四种之分。
4.swipe类事件
滑动事件，有swipe/swipeLeft/swiperighgt/swipeup/swipedown五种之分。
移动端前端⼿势事件
⼿势事件只是概念型，⽬前还没有浏览器原⽣⽀持，按照概念可以分为gesturestart 、gesturechange 、gestureend三种事件。
gesturestart：当有两根或多根⼿指放到屏幕上的时候触发
gesturechange：当有两根或多根⼿指在屏幕上，并且有⼿指移动的时候触发
gestureend：当倒数第⼆根⼿指提起的时候触发，结束gesture
移动端页⾯渲染优化
HTML⽂档是以包含⽂档编码信息的数据流⽅式在⽹络间传输，页⾯的编码信息⼀般会在HTTP响应的头部信息或在⽂档内的HTML标记中指明，客户端浏览器只有在确定了页⾯
编码后才能正确的渲染页⾯，所以在绘制页⾯或执⾏任何的javascript代码前，⼤部分的浏览器（ie6、ie7、ie8除外）都会缓冲⼀定字节的数据来从中查编码信息，不同的浏
览器当中预缓冲的字节数是不⼀样的。
Viewport可以加速页⾯的渲染、减少Dom节点、尽量使⽤CSS3动画、 Touchmove、Scroll事件可导致多次渲染。
GPU渲染
开启“强制进⾏GPU渲染”的弊端。任何东西有利必有弊，“强制进⾏GPU渲染”也不例外，就看利与弊谁多⼀些了。⾸先，图形处理从由CPU承担转移到GPU上，⼿机是保证运⾏
流畅了，但耗能肯定会相应的提升，这就会造成你的⼿机续航时间将会缩短⼀些。其次，有的应⽤程序存在不⽀持GPU渲染的情况。
⾸先GPU这个东西⼀开始被造出来，就是为了解决⼤量运算的问题。它的特点是运算速度超级快但是逻辑单⼀，只能处理简单的算法，⽽难以胜任复杂的⼯作。⽐如我们影视从
业者⼀般搞的那种，⼀等半⼩时渲⼀张图的渲染，叫离线渲染。这种渲染因为算法⽐较复杂，就是GPU以前不能处理的。
所以到底那些开发⼈员到底是如何做到让GPU也慢慢能够做复杂的离线渲染，这件事情，我是搞不懂的，就像我也不知道今天在⽹上买的东西第⼆天就送到我⼿上这个事情背后
复杂的细节。我只是明⽩这种事情就是从⽆到有，花费很多聪明的⼤脑多年努⼒才慢慢做起来的。困难重重。
⽽等到GPU真的可以做离线渲染之后，我们的渲染速度就像变魔术⼀样瞬间得到超⼤幅度的提升。这种提升是由于GPU⾝体结构天⽣适合快速运算⼤量数据造成的，以前它只是
不会，现在它既然会了，那么就像脱缰的野马，你真的想象不到的快。
GPU核⼼渲染过程
应⽤程序阶段：进⾏涉及cpu和内存的算法，按照我的理解，例如在unity⾥⾯设置场景和物体，实现游戏逻辑，这些都是cpu⼲的活，但cpu并不能让它在屏幕上显⽰出来，于是cpu就把所有顶点坐标、法向量、纹理坐标、纹理等信息传递给gpu。⼏何阶段：主要负责顶点坐标变换、光照、裁剪、投影以及屏幕映射，该阶段基于 GPU 进⾏运算，它将从cpu传递过来的信息加以处理，最后得到经过变换和
投影之后的顶点坐标、颜⾊、以及纹理坐标。光照计算也在此阶段进⾏。
光栅阶段：基于⼏何阶段的输出数据，为像素（Pixel）正确配⾊，以便绘制
完整图像，该阶段进⾏的都是单个像素的操作，每个像素的信息存储在颜⾊缓冲器（color buffer 或者 frame buffer）中。
调试
(1)是否会使⽤基本的抓包⼯具、调试控制台；
(2)怎么从茫茫⽹络内容中到有⽤信息；
(3)移动端如何调试；
常⽤的调试⼯具
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论