路虽远行则将至，事虽难做则必成。

最近在做大屏需求的时候，遇到一个轮播数据的需求，查看datav文档发现确实有这个组件但这个组件只提供了一次加载轮播的例子，虽然提供了轮播加载数据updateRows方法但是文档并没有触发事件，比如轮播完数据触发事件，加载完数据事件-这些都没有说明关键时我们要解决谁来判断数据轮播完了，来触发这个事件，请求接口，加载第二页数据。

为什么要进行首屏加载优化，因为随着我们静态资源和第三方包和代码增加，压缩之后包会越来越大随着网络的影响，在我们第一输入url请求资源时候，网络阻塞，加载时间长，用户体验不好仔细观察后就会发现，代码压缩之后并没有多大，大的都是项目自身，静态资源，第三方包除去代码层面我们可以通过静态图片网络请求，gzip压缩，CDN（第三方包引入方式），浏览器缓存当我们在本地开发，需要使用到别人的包的时候。通过npm下包。

为什么要进行首屏加载优化，因为随着我们静态资源和第三方包和代码增加，压缩之后包会越来越大随着网络的影响，在我们第一输入url请求资源时候，网络阻塞，加载时间长，用户体验不好仔细观察后就会发现，代码压缩之后并没有多大，大的都是项目自身，静态资源，第三方包除去代码层面我们可以通过静态图片网络请求，gzip压缩，CDN（第三方包引入方式），浏览器缓存。

当我们使用模板进行二次开发时经常会遇到一个问题，就是有无书签栏的问题，视口就会相差一点，影响布局以谷歌浏览器为例当它没有书签栏的时候视口高度就会多50px左右，就是app-main高度会多50px左右这个问题本质是我们不知道用户浏览器是不是有书签栏和全屏的问题，那意思是有2中可能。我们不确定那解决方案就是我们写2套布局代码适配有无书签栏和有无全屏情况，麻烦的是我们要测算他们视口范围值使用css媒体查询即可，监测视口范围，但发现在某一个范围时，就执行这个范围代码，就实现适配。

当我们在一个vue页面写了html，css，js就会发现代码很多看着很头痛，其实css代码也是可以抽取出来的。我们可以在src/assets 文件下新建style文件，把样式文件放在这里，引入到vue文件这样抽取代码之后，不管时本地跑代码和上线测试，都是没有问题的，因为打包已经打进去了。

在移动端我们要通过脚手架创建项目，进行适配。移动端为什么要适配了，因为移动端手机型号是不一样的，导致分辨率不一样，所以需要适配。不然会乱。

WebSocket 是一种网络通信协议。RFC6455定义了它的通信标准。WebSocket是HTML5下一种新的协议（websocket协议本质上是一个基于tcp的协议）它实现了浏览器与服务器全双工通信，能更好的节省服务器资源和带宽并达到实时通讯的目的http是一种无状态，无连接，单向的应用层协议，它采用了请求/响应模型，通信请求只能由客户端发起，服务端对请求做出应答处理。

在台式机上开发pc端项目时，由于是1920*1080的分辨路和100缩放，看起来是没有问题。在笔记本上有问题因为现在很多14寸的笔记本，出厂默认就是125%或150%的显示。导致很多时候我们的项目，自己开发的时候都是按照100%比例来开发的，上线了就会发现这个问题。网上有很多解决方案，但都是治标不治本，表面上是适配了，但是有很多坑。效果不是很好。比如布局挤变形了，第三方组件变形，按钮错位，部分白屏，执行不了。看着很不舒服。

pc端一般是不需要适配的，因为现在的显示器分辨率一般都是1920*1080（设计图也是），一般不用管。但是有一种情况你的设计图是1920*1080，开发完了。发现别人设备因为某些原因不是这个分辨率，就要适配需求是：使用不同分辨率设备，注意是高度可能会出现滚动条。只是临时解决方案。