日常笔记2

11.响应式网站设计（Responsive Web design）是一个网站能够兼容多个终端，而不是为每一个终端做一个特定的版本。
关于原理： 基本原理是通过媒体查询（@media）查询检测不同的设备屏幕尺寸做处理。
关于兼容： 页面头部必须有mate声明的viewport。

12.less与css区别总结
（1）Less是一门CSS预处理语言，css是一种用来表现HTML或XML等文件样式的计算机语言。
（2）less扩展了CSS语言，增加了变量、Mixin、函数等特性。
（3）css可以被浏览器直接识别，less需要先编译为css。

13.iframe 有那些优点和缺点？
iframe 元素会创建包含另外一个文档的内联框架（即行内框架）。
优点：
（1）用来加载速度较慢的内容（如广告）
（2）可以使脚本可以并行下载
（3）可以实现跨子域通信
缺点：
（1）iframe 会阻塞主页面的 onload 事件
（2）无法被一些搜索引擎索识别
（3）会产生很多页面，不容易管理

14.transition和animation的区别
transition是过度属性，强调过度，它的实现需要触发一个事件（比如鼠标移动上去，焦点，点击等）才执行动画。它类似于flash的补间动画，设置一个开始关键帧，一个结束关键帧。
animation是动画属性，它的实现不需要触发事件，设定好时间之后可以自己执行，且可以循环一个动画。它也类似于flash的补间动画，但是它可以设置多个关键帧（用@keyframe定义）完成动画。

15.Vue的基本原理
当一个Vue实例创建时，Vue会遍历data中的属性，用 Object.defineProperty（vue3.0使用proxy ）将它们转为 getter/setter，并且在内部追踪相关依赖，在属性被访问和修改时通知变化。 每个组件实例都有相应的 watcher 程序实例，它会在组件渲染的过程中把属性记录为依赖，之后当依赖项的setter被调用时，会通知watcher重新计算，从而致使它关联的组件得以更新。

16.Computed 和 Watch 的区别
对于Computed：
（1）它支持缓存，只有依赖的数据发生了变化，才会重新计算
（2）不支持异步，当Computed中有异步操作时，无法监听数据的变化
（3）computed的值会默认走缓存，计算属性是基于它们的响应式依赖进行缓存的，也就是基于data声明过，或者父组件传递过来的props中的数据进行计算的。
（4）如果一个属性是由其他属性计算而来的，这个属性依赖其他的属性，一般会使用computed
（5）如果computed属性的属性值是函数，那么默认使用get方法，函数的返回值就是属性的属性值；在computed中，属性有一个get方法和一个set方法，当数据发生变化时，会调用set方法。

对于Watch：
（1）它不支持缓存，数据变化时，它就会触发相应的操作
（2）支持异步监听
（3）监听的函数接收两个参数，第一个参数是最新的值，第二个是变化之前的值
（4）当一个属性发生变化时，就需要执行相应的操作
（5）监听数据必须是data中声明的或者父组件传递过来的props中的数据，当发生变化时，会触发其他操作，函数有两个的参数：
immediate：组件加载立即触发回调函数
deep：深度监听，发现数据内部的变化，在复杂数据类型中使用，例如数组中的对象发生变化。需要注意的是，deep无法监听到数组和对象内部的变化。
当想要执行异步或者昂贵的操作以响应不断的变化时，就需要使用watch。

总结：
（1）computed 计算属性 : 依赖其它属性值，并且 computed 的值有缓存，只有它依赖的属性值发生改变，下一次获取 computed 的值时才会重新计算 computed 的值。
（2）watch 侦听器 : 更多的是观察的作用，无缓存性，类似于某些数据的监听回调，每当监听的数据变化时都会执行回调进行后续操作。

运用场景：
（1）当需要进行数值计算,并且依赖于其它数据时，应该使用 computed，因为可以利用 computed 的缓存特性，避免每次获取值时都要重新计算。
（2）当需要在数据变化时执行异步或开销较大的操作时，应该使用 watch，使用 watch 选项允许执行异步操作 ( 访问一个 API )，限制执行该操作的频率，并在得到最终结果前，设置中间状态。这些都是计算属性无法做到的。

17.最新的浏览器进程主要包含：
1个浏览器主进程
1个GPU进程（也可能存在多个，每个标签页都需要一个进程，用于绘制图形）
1个网络进程
多个插件进程（每个插件都会开启一个进程，因为防止一个插件崩溃，造成整个浏览器崩溃）
多个渲染进程（标签页需要独立的进程）

browser 进程（主进程）：负责控制浏览器除标签页外的界面，包括地址栏、书签、前进后退按钮等，以及负责与其他进程的协调工作，同时提供存储功能。
GPU 进程：负责处理与图形渲染相关的任务。（着重在于图像）
（1）图形渲染
（2）动画和过渡
（3）3D 和 WebGL 渲染
（4）视频播放和解码等
网络进程：负责处理与网络相关的任务。它主要负责管理和维护网络连接，以及处理所有的网络请求和响应。
（1）管理网络连接
（2）处理网络请求和响应
（3）处理DNS解析
（4）处理缓存
（5）处理安全问题
插件进程：用于处理浏览器插件的进程（每个插件，就会创建一个进程）
渲染进程：负责将 HTML、CSS 和 JavaScript 转换为可视化的页面。默认情况下，浏览器的tab就会创建一个渲染进程。

18.重绘就是重新绘制（repaint）：是在一个元素的外观被改变所触发的浏览器行为，浏览器会根据元素的新属性重新绘制，使元素呈现新的外观。
重排就是重新排列（reflow）：当渲染树的一部分必须更新并且节点的尺寸发生了变化，浏览器会使渲染树中受到影响的部分失效，并重新构造渲染树。

19.单页面应用程序（SPA）的优缺点
一、优点
1.良好的交互体验
2.良好的前后端工作分离模式
3.减轻服务器压力
二、缺点
1.首屏加载慢
2.不利于SEO
3.不适合开发大型项目

版本二	1.实现方式，一个页面
		2.页面性能，按需更新性能高
		3.开发效率高
		4.用户体验非常好
		5.学习成本高
		6.首屏加载满
		7.SEO差

20.Sass特色功能
（1）完全兼容 CSS3
（2）在 CSS 基础上增加变量、嵌套 (nesting)、混合 (mixins) 等功能
（3）通过函数进行颜色值与属性值的运算
（4）提供控制指令 (control directives)等高级功能
（5）自定义输出格式

21.–save 会把依赖包名称添加到 package.json 文件 dependencies 下，
–save-dev 则添加到 package.json 文件 devDependencies下