用户体验式非常重要的一环，而保证用户的页面的可获取性是最基础的；常规的做法则是对页面资源进行压缩，对资源做延迟加载等，或者说提升服务器的带宽等，但这些都是从站点应用自身上的考虑。在实际形况中，站点及应用可以满足绝对的流畅性，但是用户的网络环境千变万化，尤其是移动端用户，这种情况情况下页面加载速度的瓶颈完全就取决于用户的网络环境。
此时就需要站点在更深层次优化，要对客户端的网络状态做监控，根据访客的网络质量结合实际情况，降低资源大小，甚至只加载一些重要的资源，来优先保证用户可以获取到重点内容。
实现方案
通过浏览器的 Network Information API 接口中提供的Navigator对象的connection属性，来评估用户的连接速度以及设备所处的网络类型。
如上所属在浏览器调试窗口获取“navigator.connection”反馈到结果有以下参数
{
downlink: 4.7,
effectiveType: "4g",
onchange: null,
rtt: 100,
saveData: false,
}
- downlink：从服务器下载资源的速度（Mbps）
- effectiveType：可能的值包括：slow-2g、2g、3g、4g，就还比downlink的速度相当于什么的网络
- onchange：是在网络状态发生变化时触发的事件
- rtt：往返时间，从设备到服务器和返回的时间（ms）
监听网络变化
需要监听网络变化，只要使用属性的中onchange方法，只要网络发生变化就会触发对应事件，然后根据当前的网络质量结合自身情况去执行对应的业务逻辑。
navigator.connection.onchange = (e) => {
console.log("网络状态更改", e.target);
//需要执行逻辑
}
可以根据当前的navigator.connection中effectiveType、downlink、rtt的值来实现客户端用户网络质量的判断。
-
如何提升页面的加载速度，一直以来忽略了很重要的一点，之前的优化基本上都是从站点的角度的出发，提升程序性能，增加配置，压缩资源等。网页加载速度不止是取决于服务器的响应速度，还与客户端有关。
-
本站的主要的是分享自己建站过程中遇到的各种问题和解决方案，适合没有任何基础但是想要建立自己的一个网站的朋友，其实如果想要简单的入门让一个网站跑起来是非常的简单的。如果说是采用wordpress等CMS系统来搭建一个网站的话就更加简单了。进本上只要动手能力自学能力强一点，基本上几个小时就可以让一个站点运行起来。
-
MySQL常用的查询语句大全看这里，值得收藏。MySQL数据库管理系统由瑞典的DataKonsultAB公司研发，该公司被Sun公司收购，现在Sun公司又被Oracle公司收购，因此MySQL目前属于 Oracle 旗下产品。
-
SpringBoot中的异常处理的详细教程，处理用户请求出现运行时异常时直接响应给用户的是一个错误界面，对于用户的使用体验不友好。什么是全局异常处理机制，用来解决整个系统中任意一个控制器抛出异常时的统一处理入口，如何使用全局异常处理类 implements HandlerExceptionResolver，之后重写接口中的resolveException方法。
-
什么是Hash,Java实现哈希加解密(HmacSHA1、HmacMD5、HmacSHA256、HmacSHA512），哈希算法不可逆,不同的源数据使用同样的哈希算法，可能会产生相同的哈希值，这被称之为碰撞率(collision rate),即使是 MD5 算法，碰撞率也非常小，小到几乎可以忽略不计。大约是 1.47*10的负29次方。
-
js中的数组元素的添加方法，主要有三种方法，用索引元素添加、push( )方法、unshift()方法，push()方法在数组的尾部添加一个或多个元素，并返回数组新的长度，修改并替换了原始数组而非生成一个修改版的新数组。
-
php时间增减操作，如何获取当前时间加减几个小时、几个星期、几个月。如何时间快速简单的对时间的一个计算呢？
-
linux环境如何搭建java框架springboot，为大家演示一种快速简单的搭建springboot的方法。由于springboot是java的众多框架之一，因此需要部署好java的运行环境，即服务器安装好jdk18以及tomcat3，注意版本的兼容性。
-
MySQL是一个关系型数据库管理系统，由瑞典MySQL AB 公司开发，属于 Oracle 旗下产品。MySQL 是最流行的关系型数据库管理系统之一，在 WEB 应用方面，MySQL是最好的 RDBM
-
在我们日常工作中经常遇到截取字符串的需求，这里重点介绍两种常见的java截取字符串方法。
-
Laravel如何发送邮件呢？Laravel邮件发送功能的实现例子，从邮箱注册配置到，laravel邮件参数配置，提供纯文本邮件和富文本邮件发送两种邮件发送实例。
-
js中==和===的区别 ==和===的区别和一些比较规则: == 在比较类型不同的变量时,会进行数据类型转化,将二者转换成数据类型相同的变量,再进行比较。对于 string、number 等基础类型,== 和 === 是有区别的 a)不同类型间比较,== 之比较 "转化成同一类型后的值" 看 "值" 是否相等,=== 如果类型不同,其结果就是不等。
-
springboot，java如何获取用户的真实ip地址呢？项目开发中，不管是什么应用不管是什么语言，获取ip地址是非常关键的一环，因为管是操作日志的记录还是业务的需求上都不可或缺的用到访客的ip地址，那么在java中如何获取到IP地址呢？
-
有时候为了提升用户体验，比如在某些页面需要实现点击内容，将内容复制到剪切板，可以提升用户复制内容的操作效率；因此在实际操作中通过一定的事件触发复制功能是非常有意义的行为，下面是两种通过原生js实现复制内容到剪切板。
-
linux系统下使用Vue CLI脚手架安装vue3。Vue 提供了一个官方的 CLI，为单页面应用 (SPA) 快速搭建繁杂的脚手架。它为现代前。端工作流提供了功能齐备的构建设置。
-
linux换将下安装Composer的方法，对于需要使用laravel框架开发站点，安装Composer是非常有必要的，可以使得laravel的安装管理变得更加的方便快捷。
-
Thymeleaf 是一款用于渲染 XML/XHTML/HTML5 内容的模板引擎。它与 JSP，Velocity，FreeMaker 等模板引擎类似，也可以轻易地与 Spring MVC 等 Web 框架集成。
-
vue框架简介及其优势，Vue 是一套用于构建用户界面的渐进式JavaScript框架，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。。但是vue对于SEO并不是非常友好，及其解决方案。