学非探其花 前端开发 Categories
最近在处理一个项目的时候发现在某部 iPhone 的 Safari 上有页面无法正常访问，报错提示 Object.hasOwn 方法不存在。这基本上就是兼容性问题了，看了一下 iOS 的版本是 14.6，再一查 Object.hasOwn 在 iOS 上是从 15.4 才开始支持的。处理方案要么是把用了 hasOwn 的地方改掉（因为 Object.hasOwn 的平替方法很多，也不存在什么改的成本问题），要么就是在打包的地方配置兼容处理。如果兼容处理简单肯定是优先进行兼容处理，毕竟碰到不兼容的就改写起来也太折腾了。
最近在处理移动端页面的时候发现一个场景，当下拉框里面选项比较多出现了滚动条，同时页面也出现滚动条的情况下，在使用的时候两个滚动经常发生错乱，使用上非常不方便，本以为是个不好解决的问题，实际是有简单的解决方案来提升使用体验。
# 为什么需要
在写一个简单页面的时候可能就是直接写 CSS 来处理样式，如果页面比较多还很复杂的话直接使用原生的 CSS 相对来说就比较麻烦了，所以就有使用 Less、Sass 等预处理器方案来处理诸如嵌套以及变量等问题。 但是预处理器最终生成的 CSS 文件和直接写的 CSS 没有区别，只是对过程更加友好。所以还是有一些比较明显的问题不是很好解决：
X6 是 AntV 旗下的图编辑引擎，提供了一系列开箱即用的交互组件和简单易用的节点定制能力，方便我们快速搭建流程图、DAG 图、ER 图等图应用。
在 X6 文档的图表示例中有一个 ER 图
一个完整项目，通常都需要跟服务器进行异步的数据交互。在 React 的项目实践中，发现数据请求经历过一系列有意思的变化。
# 现象
在使用 React 18 开发应用的时候发现了一个问题就是在 useEffect 的 deps 为 [] 的情况下，里面的内容居然执行了两边。在之前的版本中可不是这么个现象，React18 之前这种情况下应该只会执行一次才是。
需求来源于一个页面上会展示很多视频让用户进行选择，如果都是直接以 video 标签的形式放在上面对加载的影响比较大，看了一下爱腾优的视频列表实际上也都只是显示一张图片，因为列表中放视频第一帧的截图基本上就能看出来这是什么视频了。
video.js 是一个比较成熟的 HTML5 视频播放框架，兼容包括桌面和移动端在内的现代浏览器，支持从“传统“的 MP4 和 WebM 到流形式的 HSL 和 DASH 等多种格式播放，不仅提供很多插件去扩展播放器，还可以通过修改 css 方便的去调整样式。
最近碰到一个需求，希望整个页面在全屏和非全屏的情况下表现形式有所不同。由于不需要过多考虑兼容性问题，还以为通过 Fullscreen_API 就能进行判断处理了，事实证明还是天真了。