前端面试小结（4）

如何优化SPA应用的首屏加载速度慢的问题？

1.将公用的JS库通过script标签外部引入，减小 app.bundel 的大小，让浏览器并行下载资源文件，提高下载速度；
2.在配置 路由时，页面和组件使用懒加载的方式引入，进一步缩小 app.bundel 的体积，在调用某个组件时再加载对应的js文件；
3.加一个首屏loading图，提升用户体验；

---

你做的页面在哪些流览器测试过？这些浏览器的内核分别是?

a、 IE(IE浏览器) : trident 内核 -ms-

b、 Firefox(火狐浏览器) ： gecko 内核 -moz-

c、 Safari(苹果浏览器) ：webkit 内核 -webkit-

d、 Opera(欧朋浏览器)：以前是 presto 内核， Opera 现已改用 Google Chrome 的 Blink 内核 -o-

e、 Chrome(谷歌浏览器)：Blink(基于 webkit ， Google 与 Opera Software 共同开发 ) -webkit-

---

HTML5有哪些新特性、移除了哪些元素？

HTML新特性：

• 图像Canvas
• 多媒体video、audio
• 本地存储localStorage、sessionStorage
• 语义化更好的内容元素article、header、footer、nav、section
• 表单控件date、time、canlendar、url、search
• 新的技术webworker、websocket、Geolocation

移除的元素：

• 纯表现的元素u、big、center、strike、tt、font、basefont
• 框架集frame、frameset、noframes

---

图片格式及特性

1、psd （photoshop的专用格式）
优点：完整保存图像的信息，包括未压缩的图像数据、图层、透明等信息，方便图像的编辑。
缺点：应用范围窄，图片容量相对比较大。
2、jpg （网页制作及日常使用最普遍的图像格式）
优点：图像压缩效率高，图像容量相对最小。
缺点：有损压缩，图像会丢失数据而失真，不支持透明背景，不能制作成动画。
3、gif （制作网页小动画的常用图像格式）
优点：无损压缩，图像容量小、可以制作成动画、支持透明背景。
缺点：图像色彩范围最多只有256色，不能保存色彩丰富的图像，不支持半透明，透明图像边缘有锯齿
4、png（网页制作及日常使用比较普遍的图像格式）
优点：无损压缩，图像容量小、支持透明背景和半透明色彩、透明图像的边缘光滑。
缺点：不能制作成动画

---

CSS3新特性

1、选择器
1）:last-child 匹配父元素的最后一个子元素。
2）:nth-child(n)匹配父元素的第n个子元素。
3）:nth-last-child(n) CSS3 匹配父元素的倒数第n个子元素。
2、@Font-face 特性
Font-face 可以用来加载字体样式，而且它还能够加载服务器端的字体文件，让客户端显示客户端所没有安装的字体
3、圆角border-radius、阴影（box-shadow）
4、文字阴影（text-shadow、），线性渐变（gradient），旋转（transform）
5、多背景（border-image）、多栏布局、媒体查询
6、在CSS3中唯一引入的伪元素是 ::selection