1.讲讲输入完网址按下回车,到看到网页这个过程中发生了什么

a. 域名解析
b. 发起TCP的3次握手
c. 建立TCP连接后发起http请求
d. 服务器端响应http请求,浏览器得到html代码
e. 浏览器解析html代码,并请求html代码中的资源
f. 浏览器对页面进行渲染呈现给用户


    2.谈谈你对前端性能优化的理解

    a. 请求数量:合并脚本和样式表,CSS Sprites,拆分初始化负载,划分主域
    b. 请求带宽:开启GZip,精简JavaScript,移除重复脚本,图像优化,将icon做成字体
    c. 缓存利用:使用CDN,使用外部JavaScript和CSS,添加Expires头,减少DNS查找,配置ETag,使AjaX可缓存
    d. 页面结构:将样式表放在顶部,将脚本放在底部,尽早刷新文档的输出
    e. 代码校验:避免CSS表达式,避免重定向


      3.前端 MV*框架的意义

      早期前端都是比较简单,基本以页面为工作单元,内容以浏览型为主,也偶尔有简单的表单操作,基本不太需要框架.
      随着 AJAX 的出现,Web2.0的兴起,人们可以在页面上可以做比较复杂的事情了,然后前端框架才真正出现了。
      如果是页面型产品,多数确实不太需要它,因为页面中的 JavaScript代码,处理交互的绝对远远超过处理模型的,但是如果是应用软件类产品,这就太需要了。
      
      长期做某个行业软件的公司,一般都会沉淀下来一些业务组件,主要体现在数据模型、业务规则和业务流程,这些组件基本都存在于后端,在前端很少有相应的组织。
      从协作关系上讲,很多前端开发团队每个成员的职责不是很清晰,有了前端的 MV框架,这个状况会大有改观。
      之所以感受不到 MV*框架的重要性,是因为Model部分代码较少,View的相对多一些。如果主要在操作View和Controller,那当然 jQuery 这类库比较好用了。


        4.请简述盒模型

        IE6盒子模型与W3C盒子模型。
        文档中的每个元素被描绘为矩形盒子。盒子有四个边界:外边距边界margin, 边框边界border, 内边距边界padding与内容边界content。
        CSS3中有个box-sizing属性可以控制盒子的计算方式,
        content-box:padding和border不被包含在定义的width和height之内。对象的实际宽度等于设置的width值和border、padding之和。(W3C盒子模型)
        border-box:padding和border被包含在定义的width和height之内。对象的实际宽度就等于设置的width值。(IE6盒子模型)


          5.请你谈谈Cookie的弊端

          a. 每个特定的域名下最多生成的cookie个数有限制
          b. IE和Opera 会清理近期最少使用的cookie,Firefox会随机清理cookie
          c. cookie的最大大约为4096字节,为了兼容性,一般不能超过4095字节
          d. 安全性问题。如果cookie被人拦截了,那人就可以取得所有的session信息。


            6.浏览器本地存储

            在HTML5中提供了sessionStorage和localStorage.
            sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁,是会话级别的存储。
            localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。


              7.web storage和cookie的区别

              a. Cookie的大小是受限的
              b. 每次你请求一个新的页面的时候Cookie都会被发送过去,这样无形中浪费了带宽
              c. cookie还需要指定作用域,不可以跨域调用
              d. Web Storage拥有setItem,getItem等方法,cookie需要前端开发者自己封装setCookie,getCookie
              e. Cookie的作用是与服务器进行交互,作为HTTP规范的一部分而存在 ,而Web Storage仅仅是为了在本地“存储”数据而生
              f. IE7、IE6中的UserData通过简单的代码封装可以统一到所有的浏览器都支持web storage


                8.线程与进程的区别

                一个程序至少有一个进程,一个进程至少有一个线程
                
                b. 线程的划分尺度小于进程,使得多线程程序的并发性高
                
                c. 进程在执行过程中拥有独立的内存单元,而多个线程共享内存,从而极大地提高了程序的运行效率
                
                d. 每个独立的线程有一个程序运行的入口、顺序执行序列和程序的出口。但是线程不能够独立执行,必须依存在应用程序中,由应用程序提供多个线程执行控制
                
                e. 多线程的意义在于一个应用程序中,有多个执行部分可以同时执行。但操作系统并没有将多个线程看做多个独立的应用,来实现进程的调度和管理以及资源分配


                  9.请说出三种减少页面加载时间的方法

                  a. 尽量减少页面中重复的HTTP请求数量
                  
                  b. 服务器开启gzip压缩
                  
                  c. css样式的定义放置在文件头部
                  
                  d. Javascript脚本放在文件末尾
                  
                  e. 压缩合并Javascript、CSS代码
                  
                  f. 使用多域名负载网页内的多个文件、图片


                    10.你都使用哪些工具来测试代码的性能?

                    JSPerf, Dromaeo


                      11.对前端界面工程师这个职位是怎么样理解的?

                      a. 前端是最贴近用户的程序员,前端的能力就是能让产品从 90分进化到 100 分,甚至更好
                      
                      b. 参与项目,快速高质量完成实现效果图,精确到1px;
                      
                      c. 与团队成员,UI设计,产品经理的沟通;
                      
                      d. 做好的页面结构,页面重构和用户体验;
                      
                      e. 处理hack,兼容、写出优美的代码格式;
                      
                      f. 针对服务器的优化、拥抱最新前端技术。


                        12.说说最近最流行的一些东西吧?常去哪些网站?

                        CSDN、SegmentFault、php.net、MDN、css参考手册、iconfont、
                        underscore、github、Bootstrap、W3Shool、W3Cplus、caniuse


                          13.请介绍下cache-control

                          每个资源都可以通过 Cache-Control HTTP 头来定义自己的缓存策略
                          Cache-Control 指令控制谁在什么条件下可以缓存响应以及可以缓存多久
                          Cache-Control 头在 HTTP/1.1 规范中定义,取代了之前用来定义响应缓存策略的头(例如 Expires)。


                            14.一个页面上有大量的图片(大型电商网站),加载很慢,你有哪些方法优化这些图片的加载,给用户更好的体验。

                            图片懒加载,滚动到相应位置才加载图片。
                            
                            b. 图片预加载,如果为幻灯片、相册等,将当前展示图片的前一张和后一张优先下载。
                            
                            c. 使用CSSsprite,SVGsprite,Iconfont、Base64等技术,如果图片为css图片的话。
                            
                            d. 如果图片过大,可以使用特殊编码的图片,加载时会先加载一张压缩的特别厉害的缩略图,以提高用户体验。


                              15.请阐述table的缺点

                              太深的嵌套,比如table>tr>td>h3,会导致搜索引擎读取困难,而且,最直接的损失就是大大增加了冗余代码量。
                              
                              b. 灵活性差,比如要将tr设置border等属性,是不行的,得通过td
                              
                              c. 代码臃肿,当在table中套用table的时候,阅读代码会显得异常混乱
                              
                              d. 混乱的colspan与rowspan,用来布局时,频繁使用他们会造成整个文档顺序混乱。
                              
                              e. table需要多次计算才能确定好其在渲染树中节点的属性,通常要花3倍于同等元素的时间。