1.CommonJS 中的 require/exports 和 ES6 中的 import/export 区别?

CommonJS 模块的重要特性是加载时执行,
即脚本代码在 require 的时候,就会全部执行。
一旦出现某个模块被”循环加载”,
就只输出已经执行的部分,
还未执行的部分不会输出。 ES6 模块是动态引用,
如果使用 import 从一个模块加载变量,
那些变量不会被缓存,
而是成为一个指向被加载模块的引用,
需要开发者自己保证,
真正取值的时候能够取到值。 import/export 最终都是编译为 require/exports 来执行的。
CommonJS 规范规定,
每个模块内部,
module 变量代表当前模块。
这个变量是一个对象,
它的 exports 属性(即 module.exports )是对外的接口。
加载某个模块,
其实是加载该模块的 module.exports 属性。
export 命令规定的是对外的接口,
必须与模块内部的变量建立一一对应关系。

2.项目做过哪些性能优化?

减少 HTTP 请求数
减少 DNS 查询
使用 CDN
避免重定向
图片懒加载
减少 DOM 元素数量
减少 DOM 操作
使用外部 JavaScript 和 CSS
压缩 JavaScript 、 CSS 、字体、图片等
优化 CSS Sprite
使用 iconfont
字体裁剪
多域名分发划分内容到不同域名
尽量减少 iframe 使用
避免图片 src 为空
把样式表放在 中
把脚本放在页面底部

3.js 异步加载的方式?

渲染引擎遇到 script 标签会停下来,
等到执行完脚本,继续向下渲染
defer 是“渲染完再执行”,async 是“下载完就执行”,
defer 如果有多个脚本,
会按照在页面中出现的顺序加载,
多个async 脚本不能保证加载顺序
加载 es6模块的时候设置 type=module,
异步加载不会造成阻塞浏览器,页面渲染完再执行,
可以同时加上async属性,
异步执行脚本(利用顶层的this等于undefined这个语法点,
可以侦测当前代码是否在 ES6 模块之中)

4.get与post 通讯的区别?

Get 请求能缓存,Post 不能
Post 相对 Get 安全一点点,
因为Get 请求都包含在 URL 里,且会被浏览器保存历史纪录,
Post 不会,但是在抓包的情况下都是一样的。
Post 可以通过 request body来传输比 Get 更多的数据,Get 没有这个技术
URL有长度限制,会影响 Get 请求,
但是这个长度限制是浏览器规定的,不是 RFC 规定的
Post 支持更多的编码类型且不对数据类型限制

5.为什么虚拟 dom 会提高性能?

虚拟 dom 相当于在 js 和真实 dom 中间加了一个缓存,
利用 dom diff 算法避免了没有必要的 dom 操作,从而提高性能。 用 JavaScript 对象结构表示 DOM 树的结构;
然后用这个树构建一个真正的 DOM 树,
插到文档当中当状态变更的时候,重新构造一棵新的对象树。
然后用新的树和旧的树进行比较,
记录两棵树差异把 所记录的差异应用到步骤 所构建的真正的 DOM 树上,视图就更新了。
 

撩课-Web大前端每天5道面试题-Day33的更多相关文章

  1. 撩课-Web大前端每天5道面试题-Day10

    1. px和em的区别? px和em都是长度单位; 区别是: px的值是固定的,指定是多少就是多少, 计算比较容易. em得值不是固定的,并且em会继承父级元素的字体大小. 浏览器的默认字体高都是16 ...

  2. 撩课-Web大前端每天5道面试题-Day4

    1. 如何实现瀑布流? 瀑布流布局的原理: ) 瀑布流布局要求要进行布置的元素等宽, 然后计算元素的宽度, 与浏览器宽度之比,得到需要布置的列数; ) 创建一个数组,长度为列数, 里面的值为已布置元素 ...

  3. 撩课-Web大前端每天5道面试题-Day1

    1. var的变量提升的底层原理是什么? JS引擎的工作方式是: 1) 先解析代码,获取所有被声明的变量: 2)然后在运行.也就是说分为预处理和执行两个阶段. 变量提升:所有变量的声明语句都会被提升到 ...

  4. 撩课-Web大前端每天5道面试题-Day11

    1. 如何手写一个JQ插件? 方式一: $.extend(src) 该方法就是将src合并到JQ的全局对象中去: $.extend({ log: ()=>{alert('撩课itLike');} ...

  5. 撩课-Web大前端每天5道面试题-Day31

    1.web storage和cookie的区别? Web Storage的概念和cookie相似, 区别是它是为了更大容量存储设计的. Cookie的大小是受限的, 并且每次你请求一个新的页面的时候C ...

  6. 撩课-Web大前端每天5道面试题-Day25

    1.web前端开发,如何提高页面性能优化? 内容方面: .减少 HTTP 请求 (Make Fewer HTTP Requests) .减少 DOM 元素数量 (Reduce the Number o ...

  7. 撩课-Web大前端每天5道面试题-Day7

    1. 你能描述一下渐进增强和优雅降级之间的不同吗? 定义: 优雅降级(graceful degradation): 一开始就构建站点的完整功能, 然后针对浏览器测试和修复 渐进增强(progressi ...

  8. 撩课-Web大前端每天5道面试题-Day30

    1.什么叫优雅降级和渐进增强? 优雅降级: Web站点在所有新式浏览器中都能正常工作, 如果用户使用的是老式浏览器, 则代码会针对旧版本的IE进行降级处理了, 使之在旧式浏览器上以某种形式降级体验却不 ...

  9. 撩课-Web大前端每天5道面试题-Day23

    1.为什么用Nodejs,它有哪些优缺点? 优点: 事件驱动,通过闭包很容易实现客户端的生命活期. 不用担心多线程,锁,并行计算的问题 V8引擎速度非常快 对于游戏来说,写一遍游戏逻辑代码,前端后端通 ...

随机推荐

  1. 有标号的DAG图计数1~4

    前言 我什么都不会,菜的被关了起来. 有标号的DAG图I Solution 考虑递推,设\(f_i\)表示i个点的答案,显然这个东西是可以组合数+容斥递推? 设\(f_i\)表示i个点的答案,我们考虑 ...

  2. 暴破助攻提权:ruadmin

    i春秋作家:yangyangwithgnu 1 缘由 千辛万苦拿下的 webshell 不是 www-data 用户就是 networkservice 权限,要想拓展攻击面.扩大战果,提权,是必经之路 ...

  3. flaks___git

    今天呢  我给大家分享一个超实用的一个把代码分享到云端的一种操作 比如我们在家里,要想做项目的话可以直接从云端上拉取下来代码直接开始工作了 而且还可以随时修改,没有地点的局限性了,只要你想敲,随时随地 ...

  4. SpringBoot配置文件application.properties详解

    喜欢的朋友可以关注下,粉丝也缺. 相信很多的码友在接触springboot时,不知道怎么去配置一些项目中需要的配置,比如数据源,tomcat调优,端口等等,下面我就给大家奉献出一些项目中常用的配置信息 ...

  5. 关于AOP的PIAB

    AOP:面向切面编程,也就是在运行过程中,按照需要动态加载功能块 PIAB:含义可以从下面提取 Microsoft Patterns & Practices团队在2007年发布的Enterpr ...

  6. PHP:判断客户端是否使用代理服务器及其匿名级别

    要判断客户端是否使用代理服务器,可以从客户端所发送的环境变量信息来判断. 具体来说,就是看HTTP_VIA字段,如果这个字段设置了,说明客户端使用了代理服务器. 匿名级别可以参考下表来判断. 给出一个 ...

  7. Entity framework 预热

    Entity framework  预热 对于在应用程序中定义的每个DbContext类型,在首次使用时,Entity Framework都会根据数据库中的信息在内存生成一个映射视图(mapping ...

  8. ASP.NET状态管理的总结

    阅读目录 开始 hidden-input QueryString Cookie ApplicationState ViewState,ControlState Session Profile 各种状态 ...

  9. 改善android性能工具篇【zipalign】

    什么是Zipalign?      Zipalign是一个android平台上整理APK文件的工具,它首次被引入是在Android 1.6版本的SDK软件开发工具包中.它能够对打包的Android应用 ...

  10. 如何用R来处理数据表的长宽转换(图文详解)

    不多说,直接上干货! 很多地方都需用到这个知识点,比如Tableau里.   通常可以采取如python 和 r来作为数据处理的前期. Tableau学习系列之Tableau如何通过数据透视表方式读取 ...