
获得徽章 9
- 《OpenAI just put the final nail in the coffin of the open World Wide Web》
OpenAI近期发布的Operator AI代理标志着互联网使用模式和经济结构的根本转变。Operator的发布可能是开放互联网走向终结的开始。随着AI代理的普及,传统的互联网经济模式面临重大挑战,可能导致信息获取方式的根本变化。展开评论点赞 - <div className={enabled ? 'enabled' : null}> Hi </div>
代替
<div className={enabled ? 'enabled' : ''}> Hi </div>
=> <div class>Hi</div> 残留属性 class展开赞过12 - 6.1 - hooks 学习5
- MutationObserver(developer.mozilla.org)提供了监视对 DOM 树所做更改的能力。
- 自定义 hook 可以返回 React hook 钩子调用
- 利用 React.useRef() 跨越组件渲染周期来存储状态或属性(创建静态数据不会引起重新渲染,因此保留上一次的值,除非引用使用?)展开赞过11 - 5.29 - hooks 学习4
- 交叉口观察者 API(developer.mozilla.org)
下面这些情况都用到相交检测:
1. 图片懒加载——当图片滚动到可见时才进行加载
2. 滚动内容无限——也就是直接滚动到用户感知翻阅内容底部时加载更多,而无需用户操页,给一个网页可以无限滚动的错误
3. 检测广告的曝光情况——为了计算广告,需要知道广告的曝光情况
4. 在用户看见区域时执行任务或播放动画展开评论点赞 - 5.23 - hooks 学习3
- 创建 portal 允许在父组件之外渲染子组件。(Portal 提供了一种将子节点渲染到存在于父组件以外的 DOM 节点的优秀的方案)也就是适合脱离文档流的组件。
1. 使用 ReactDOM.createPortal() 和 ReactDOM.unmountComponentAtNode()创建和删除 portal 的功能。并使用 useCallback() 钩子将这些函数包装和记忆为createPortal()。
- 使用useState()带有函数的钩子来懒惰地初始化值。
- useRequestAnimationFrame 动画函数钩子
1. 参数 callback 参数与performance.now()的返回值相同,它表示 requestAnimationFrame() 开始去执行回调函数的时刻。
2. 返回一个 long 整数,请求 ID 是回调列表中唯一的标识,用于取消回调函数。展开评论点赞 - 5.22 - hooks 学习2
- 启用正文滚动锁定hook。
1. 使用useLayoutEffect()空数组作为第二个参数,仅在安装组件时执行一次提供的回调。
(其函数签名与 useEffect 相同,但它会在所有的 DOM 变更之后同步调用 effect。可以使用它来读取 DOM 布局并同步触发重渲染。在浏览器执行绘制之前,useLayoutEffect 内部的更新计划将被同步刷新。)
2. 使用 Window.getComputedStyle() 获取元素值,目的在于拿到元素实时样式。
(返回的对象是一个实时的 CSSStyleDeclaration 对象,当元素的样式更改时,它会自动更新本身。)
- 客户端在线还是离线
1. 使用Navigator.onLineWeb API 来获取客户端的在线状态。展开评论点赞