1.HTTP和HTTPS

HTTP协议通常承载于TCP协议之上,在HTTP和TCP之间添加一个安全协议层(SSL或TSL),这个时候,就成了我们常说的HTTPS。
默认HTTP的端口号为80,HTTPS的端口号为443。
为什么HTTPS安全
因为网络请求需要中间有很多的服务器路由器的转发。中间的节点都可能篡改信息,而如果使用HTTPS,密钥在你和终点站才有。https之所以比http安全,是因为他利用ssl/tls协议传输。它包含证书,卸载,流量转发,负载均衡,页面适配,浏览器适配,refer传递等。保障了传输过程的安全性


    2.对前端模块化的认识

    AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。
    CMD 是 SeaJS 在推广过程中对模块定义的规范化产出。
    AMD 是提前执行,CMD 是延迟执行。
    AMD推荐的风格通过返回一个对象做为模块对象,CommonJS的风格通过对module.exports或exports的属性赋值来达到暴露模块对象的目的。
    CMD模块方式
         define(function(require, exports,module) {
          // 模块代码
        });


      3.Javascript垃圾回收方法

      标记清除(mark and sweep)
      
      这是JavaScript最常见的垃圾回收方式,当变量进入执行环境的时候,比如函数中声明一个变量,垃圾回收器将其标记为“进入环境”,当变量离开环境的时候(函数执行结束)将其标记为“离开环境”。
      
      垃圾回收器会在运行的时候给存储在内存中的所有变量加上标记,然后去掉环境中的变量以及被环境中变量所引用的变量(闭包),在这些完成之后仍存在标记的就是要删除的变量了
      
      引用计数(reference counting)
      
      在低版本IE中经常会出现内存泄露,很多时候就是因为其采用引用计数方式进行垃圾回收。引用计数的策略是跟踪记录每个值被使用的次数,当声明了一个变量并将一个引用类型赋值给该变量的时候这个值的引用次数就加1,如果该变量的值变成了另外一个,则这个值得引用次数减1,当这个值的引用次数变为0的时 候,说明没有变量在使用,这个值没法被访问了,因此可以将其占用的空间回收,这样垃圾回收器会在运行的时候清理掉引用次数为0的值占用的空间。
      
      在IE中虽然JavaScript对象通过标记清除的方式进行垃圾回收,但BOM与DOM对象却是通过引用计数回收垃圾的, 
      也就是说只要涉及BOM及DOM就会出现循环引用问题。


        4.你觉得前端工程的价值体现在哪

        为简化用户使用提供技术支持(交互部分)
        为多个浏览器兼容性提供支持
        为提高用户浏览速度(浏览器性能)提供支持
        为跨平台或者其他基于webkit或其他渲染引擎的应用提供支持
        为展示数据提供支持(数据接口)


          5.谈谈性能优化问题

          欢迎使用,请输入内容...

          代码层面:避免使用css表达式,避免使用高级选择器,通配选择器。
          
          缓存利用:缓存Ajax,使用CDN,使用外部js和css文件以便缓存,添加Expires头,服务端配置Etag,减少DNS查找等
          
          请求数量:合并样式和脚本,使用css图片精灵,初始首屏之外的图片资源按需加载,静态资源延迟加载。
          
          请求带宽:压缩文件,开启GZIP,
          
          代码层面的优化
          
          用hash-table来优化查找
          
          少用全局变量
          
          用innerHTML代替DOM操作,减少DOM操作次数,优化javascript性能
          
          用setTimeout来避免页面失去响应
          
          缓存DOM节点查找的结果
          
          避免使用CSS Expression
          
          避免全局查询
          
          避免使用with(with会创建自己的作用域,会增加作用域链长度)
          
          多个变量声明合并
          
          避免图片和iFrame等的空Src。空Src会重新加载当前页面,影响速度和效率
          
          尽量避免写在HTML标签中写Style属性
          
          移动端性能优化
          
          尽量使用css3动画,开启硬件加速。
          
          适当使用touch事件代替click事件。
          
          避免使用css3渐变阴影效果。
          
          可以用transform: translateZ(0)来开启硬件加速。
          
          不滥用Float。Float在渲染时计算量比较大,尽量减少使用
          
          不滥用Web字体。Web字体需要下载,解析,重绘当前页面,尽量减少使用。
          
          合理使用requestAnimationFrame动画代替setTimeout
          
          CSS中的属性(CSS3 transitions、CSS3 3D transforms、Opacity、Canvas、WebGL、Video)会触发GPU渲染,请合理使用。过渡使用会引发手机过耗电增加
          
          PC端的在移动端同样适用


            6.什么是Etag?

            当发送一个服务器请求时,浏览器首先会进行缓存过期判断。浏览器根据缓存过期时间判断缓存文件是否过期。
            
            情景一:若没有过期,则不向服务器发送请求,直接使用缓存中的结果,此时我们在浏览器控制台中可以看到 200 OK(from cache) ,此时的情况就是完全使用缓存,浏览器和服务器没有任何交互的。
            
            情景二:若已过期,则向服务器发送请求,此时请求中会带上①中设置的文件修改时间,和Etag
            
            然后,进行资源更新判断。服务器根据浏览器传过来的文件修改时间,判断自浏览器上一次请求之后,文件是不是没有被修改过;根据Etag,判断文件内容自上一次请求之后,有没有发生变化
            
            情形一:若两种判断的结论都是文件没有被修改过,则服务器就不给浏览器发index.html的内容了,直接告诉它,文件没有被修改过,你用你那边的缓存吧—— 304 Not Modified,此时浏览器就会从本地缓存中获取index.html的内容。此时的情况叫协议缓存,浏览器和服务器之间有一次请求交互。
            
            情形二:若修改时间和文件内容判断有任意一个没有通过,则服务器会受理此次请求,之后的操作同①
            
            ① 只有get请求会被缓存,post请求不会


            • 用户: fuduji 时间: 2020-02-01 16:45

              ETag 是在 HTTP Request, Response 可以带上的一个参数,用于检测内容是否有更新过,以减少网络开销。Etags是一种Web缓存验证机制,并且允许客户端进行缓存协商,能够更加高效的利用客户端的缓存。

            7.Expires和Cache-Control

            Expires要求客户端和服务端的时钟严格同步。HTTP1.1引入Cache-Control来克服Expires头的限制。如果max-age和Expires同时出现,则max-age有更高的优先级。
            
                Cache-Control:no-cache, private, max-age=0
            
                ETag: abcde
            
                Expires: Thu, 15 Apr 201420:00:00 GMT
            
                Pragma: private
            
                Last-Modified:$now //RFC1123 format


              8.ETag应用:

              Etag由服务器端生成,客户端通过If-Match或者说If-None-Match这个条件判断请求来验证资源是否修改。常见的是使用If-None-Match。请求一个文件的流程可能如下:
              
              ====第一次请求===
              
              1.客户端发起 HTTP GET 请求一个文件;
              
              2.服务器处理请求,返回文件内容和一堆Header,当然包括Etag(例如"2e681a-6-5d044840")(假设服务器支持Etag生成和已经开启了Etag).状态码200
              
              ====第二次请求===
              
              客户端发起 HTTP GET 请求一个文件,注意这个时候客户端同时发送一个If-None-Match头,这个头的内容就是第一次请求时服务器返回的Etag:2e681a-6-5d0448402.服务器判断发送过来的Etag和计算出来的Etag匹配,因此If-None-Match为False,不返回200,返回304,客户端继续使用本地缓存;流程很简单,问题是,如果服务器又设置了Cache-Control:max-age和Expires呢,怎么办
              
              答案是同时使用,也就是说在完全匹配If-Modified-Since和If-None-Match即检查完修改时间和Etag之后,
              
              服务器才能返回304.(不要陷入到底使用谁的问题怪圈)
              
              为什么使用Etag请求头?
              
              Etag 主要为了解决 Last-Modified 无法解决的一些问题。


                9.栈和队列的区别?

                栈的插入和删除操作都是在一端进行的,而队列的操作却是在两端进行的。
                
                队列先进先出,栈先进后出。
                
                栈只允许在表尾一端进行插入和删除,而队列只允许在表尾一端进行插入,在表头一端进行删除


                  10.栈和堆的区别?

                  栈区(stack)—   由编译器自动分配释放   ,存放函数的参数值,局部变量的值等。
                  堆区(heap)   —   一般由程序员分配释放,   若程序员不释放,程序结束时可能由OS回收。
                  堆(数据结构):堆可以被看成是一棵树,如:堆排序;
                  栈(数据结构):一种先进后出的数据结构。