FE Tycoon
#CSS #文章 HTML、CSS(借助Sass简化开发)创建一个具有倾斜角度窗口和悬停效果的轮播图。
https://frontendmasters.com/blog/creating-an-angled-slider/
https://frontendmasters.com/blog/creating-an-angled-slider/
#文章 关于如何使用TypeScript发布基于ESM(ECMAScript模块)的npm包的教程文章。
https://2ality.com/2025/02/typescript-esm-packages.html
https://2ality.com/2025/02/typescript-esm-packages.html
#文章 富文本编辑器怎么选择?虽然文章夹带私货,但是对比了大多富文本库
https://liveblocks.io/blog/which-rich-text-editor-framework-should-you-choose-in-2025
https://liveblocks.io/blog/which-rich-text-editor-framework-should-you-choose-in-2025
#文章 js分解长任务的方法
以下是文章中提到的几种方案:
1.
通过递归调用
2.异步/等待+定时器
利用
3.
使用
4.
通过
5.
利用
6.
通过
7.Web Workers
将任务移至主线程之外的Web Workers中执行,完全避免阻塞主线程,适合可以离线处理的复杂任务。
https://macarthur.me/posts/long-tasks/
以下是文章中提到的几种方案:
1.
setTimeout()
+递归通过递归调用
setTimeout()
,将任务拆分成多个事件循环的tick,避免长时间阻塞主线程。2.异步/等待+定时器
利用
async/await
结合setTimeout()
,简化任务拆分逻辑,避免递归,代码更简洁易读。3.
scheduler.postTask()
使用
Scheduler
接口的postTask()
方法,以更高效和可控的方式调度任务,支持设置任务优先级。4.
scheduler.yield()
通过
Scheduler
接口的yield()
方法,在任务执行过程中释放主线程,让浏览器有机会处理其他任务,保持响应性。5.
requestAnimationFrame()
利用
requestAnimationFrame()
在浏览器重绘周期之前调度任务,适合与渲染相关的任务,但可能影响渲染性能。6.
MessageChannel()
通过
MessageChannel
实现任务拆分,类似于零延迟的setTimeout()
,但实现较为复杂,适合对性能要求较高的场景。7.Web Workers
将任务移至主线程之外的Web Workers中执行,完全避免阻塞主线程,适合可以离线处理的复杂任务。
https://macarthur.me/posts/long-tasks/
#开发工具 Github 拉取代码仓库,账户密码的方式不可用了,推荐的方式是创建并管理身份凭据,管理方式有:
1.
2.
https://docs.github.com/zh/get-started/getting-started-with-git/caching-your-github-credentials-in-git
1.
brew install gh
2.
brew install --cask git-credential-manager
https://docs.github.com/zh/get-started/getting-started-with-git/caching-your-github-credentials-in-git
#React #文章 useSyncExternalStore 实践应用:如何构建 React 库
https://tigerabrodi.blog/how-to-build-a-library-in-react
https://tigerabrodi.blog/how-to-build-a-library-in-react
#文章 #React react-router 中动态样式表(以前是 Remix)
https://sergiodxa.com/tutorials/load-dynamic-stylesheets-in-react-router
https://sergiodxa.com/tutorials/load-dynamic-stylesheets-in-react-router
#React #文章 组件中的单一原则,一个类应该只有一个改变的理由。
https://cekrem.github.io/posts/single-responsibility-principle-in-react/
https://cekrem.github.io/posts/single-responsibility-principle-in-react/