前端面试题---持续更新

一.html前后端渲染的区别,单页面开发以及多页面开发的区别?

前端页面渲染一共分为三种:纯后端渲染纯前端渲染服务端js渲染结合前端渲染

纯后端渲染

纯后端渲染,DOM树的生成完全是后端服务器中完成的,相当于后端服务器的程序会把各种的数据填充进DOM中生成一个DOM树,并转换成一个字节流作为HTTP response的body返回给浏览器

纯前端渲染

纯前端渲染可以解决纯后端渲染中出现的体验问题。纯前端渲染把DOM生成的逻辑都放在了前端,这是后端只会返回一个框架的DOM结构,比如只带一个容器的元素的DOM(Vue中就一个

),然后由js代码把页面的内容渲染到这个容器元素中。

服务端js渲染结合前端渲染

主要是把前两个阶段中,一些交给纯后端DOM渲染,逻辑分离的不好,但是,交给纯前端DOM渲染又会造成较高延迟的部分单独分离出来形成了一独立的DOM渲染阶段,保留代码中天然的展示层和数据层的分离,又把API请求的累计延迟减少了很多,从SEO角度来说渲染结果对搜索引擎也很友好。当然,这样的做法需要给整体的架构增加一个独立的单元,给开发和部署都带来了更高复杂性。

单页面应用(SPA),通俗一点说就是指只有一个主页面的应用,浏览器一开始要加载所有必须的html,js,css。所有的页面内容都包含在这个所谓的主页面中,但是在写的时候,还是会分开写(页面片段),然后在交互的时候由路由程序动态载入,单页面的页面跳转,仅刷新局部的资源。多用于pc端

多页面应用(MPA),就是指一个应用中有多个页面,页面跳转时是整页面刷新

单页面的优点:
1.用户体验好,快,内容的改变不需要重新加载整个页面,基于只一点SPA对服务器压力较小
2.前后端分离
3.页面效果会比较炫(切页面内容时可以有专场动画)

单页面的缺点:
1.不利于SEO

  1. 导航不可用,如果一定要用导航需要自己实现前进、后退。(由于是单页面应用不能用浏览器的前进后退的前进后退功能,所以需要自己建立堆栈管理)

3.初次加载耗时长,会有白屏出现
4.页面复杂度提高很多

二.在vue中不使用input元素实现双向数据绑定

在前端中有一个contenteditable属性,在一个元素设置contenteditable属性为true时,该元素具有可编辑的功能。
但是我们在div上写v-model是不起作用的,首先,来看一下v-model是怎么实现的。

//使用input的组件 base-input



// 使用时

使用div我们只需要将input中的方法移植到div上就可以了

// 使用contenteditable属性的div base-div



// 使用时

三、基础的订阅与发布

let publisher = {
    handlers:{},
    subscribe:function(name,handler){
        this.handlers[name] = handler
    },
    publish:function(name,args){
        let handler = this.handlers[name]
        if(handler){
            handler(args)
        }
    }
}

publisher.subscribe('say',function(something){console.log(something)})

publisher.publish("say","你好")

支持

你可能感兴趣的:(vue.js,javascript,html)