深入攻防转换，提升专业能力

拦截非法请求，需要分析异常来源特征。

a.比如使用了代理，带有Proxy-Connection请求头；可能使用了云机器，IP池分散攻击等

b.缺少了正常请求的参数、进而参数非法？

一场上行机器IP变动，nginx dns缓存的事故教训，导致网站服务不可用。有些事经历过，才明白如何做得更好，才有更深的见解和专业能力。

网友类似帖

https://zhidao.baidu.com/question/1519558219368498780/answer/4093022442.html

。。。

1. image-set 背景图片支持设置多种分辨率图片，浏览器择优选择。同时type方法支持根据MIME类型区分设置不同格式图片（safari暂不支持），实现类似picture选择的效果。

针对不支持的情形，可以先用background-image设置一个保底图片，然后再配置一条image-set的规则，于是支持的浏览器则会覆盖生效此规则。

2. img图片使用原生懒加载loading属性指定为lazy时，safari上可能遇到先显示alt文案，再显示图片的情况。

暂未找到合适的解释说明。设置有alt文案的图片，要避免首屏图片设置loading懒加载。某些场景下，或可不设置alt文案。😅

3. ::-webkit-scrollbar自定义设置滚动条宽度时，同时设置scrollbar-color、scroll-width标准属性来支持火狐浏览器。
scrollbar-width: thin;

//thin显示纤细滚动条；值为none时则不显示滚动条，内容还可滚动

scrolbar-color: #000, #ccc; 

//前值为可移动的区域颜色，后值为滚动条固定底块

4. 学生邮箱识别参考项目：

https://github.com/JetBrains/swot

。。。

常用的几个在线图片压缩网站：
https://squoosh.app/
https://www.iloveimg.com/zh-tw
https://tinypng.com/

模糊图片占位，视觉呈现，比单纯的灰色占位背景是不是更友好呢
https://blurha.sh/
https://github.com/woltapp/blurhash

跨平台emoji显示，表情跨平台，视觉表现如果要一致，还得用图片。

https://github.com/twitter/twemoji