温故而知新(第四天)

1.你知道 style 上加 scoped 属性的原理吗?

        先说一下scoped是干什么的,在 Vue 组件中,为了使样式私有化(模块化),不对全局造成污染,可以在 style 标签上添加 scoped 属性以表示它的只属于当下的模块,局部有效。如果 一个项目中的所有 Vue 组件 style 标签全部加上了 scoped,相当于实现了样式 的私有化.

        它的原理是通过PostCSS 转移实现,PostCSS 给所有 dom 添加了一个唯一不重复的动态属性,然后,给 CSS 选择 器额外添加一个对应的属性选择器来选择该组件中 dom,这种做法使得样式私有化

2.说说你对 SPA 单页面的理解,它的优缺点分别是什么?

        SPA页面是一种特殊的Web应用.它将所有的活动局限于一个 Web 页面中,仅在该 Web 页面初始化时加 载相应的 HTML、JavaScript 和 CSS。一旦页面加载完成了,SPA 不会因为用户 的操作而进行页面的重新加载或跳转。取而代之的是利用 JavaScript 动态的 变换 HTML 的内容,从而实现 UI 与用户的交互。由于避免了页面的重新加载, SPA 可以提供较为流畅的用户体验。得益于 ajax,我们可以实现无跳转刷新,又多亏了浏览器的 histroy 机制,我们用 hash 的变化从而可以实现推动界面变化

        当然任何东西都有两面性,下面我们来说一说它的优缺点

        它的优点有以下几种:

        1、 无刷新界面,给用户体验原生的应用感觉

        2、 节省原生(android 和 ios)app 开发成本

        3、 提高发布效率,无需每次安装更新包。这个对于 ios 开发人员来说印象尤 其深吧。

        4、 容易借助其他知名平台更有利于营销和推广

        5、 符合 web2.0 的趋势

        它的缺点有以下几种:

        1、效果和性能确实和原生的有较大差距
        2、各个浏览器的版本兼容性不一样
        3、业务随着代码量增加而增加,不利于首屏优化
        4、某些平台对 hash 有偏见,有些甚至不支持 pushstate
        5、不利于搜索引擎抓取

Guess you like

Origin blog.csdn.net/hx_programmer/article/details/121213535