自从 2014 年 HTML5 正式推荐标准发布以来，HTML5 增加了越来越多强大的特性和功能，而在这其中，工作线程（Web Worker）概念的推出让人眼前一亮，但未曾随之激起多大的浪花，并被在其随后工程侧的 Angular、Vue、React 等框架的「革命」浪潮所淹没。当然，我们总会偶然看过一些文章介绍，或出于学习的目的做过一些应用场景下的练习，甚或在实际项目中的涉及大量数据计算场景中真的使用过。但相信也有很多人和我一样茫然，找不到这种高大上的技术在实际项目场景中能有哪些能起到广泛作用的应用。
重写一个应用是一件简单的事，可是演进一个应用则是一件复杂的工作。 过去的一年多里，我在工作上的主要职责是：手机 APP 开发。日常主要是编写基于 Ionic 和 Angular 的混合应用，并想方设法地帮助客户将之与 React Native 相结合。在完成了嵌入 WebView 后，重写插件等一系列工作后，便想记录一下这个过程中遇到的坑。 平滑地演进 如我在开头所说，在有足够人力和物力的情况下，最好的方式就是在重写应用。 一来，应用在其生命周期里，经过了不同的开发人员、不同的业务变更，必然有大量的遗留代码
作为 iOS 开发人员，拥有合适的工具可以极大地提高您的工作效率和工作质量。无论您是刚刚起步还是已经开发 iOS 应用程序多年，以下是每个 iOS 开发人员都应该了解的 10 大必备工具。
作者：jolamjiang，腾讯 WXG 前端开发工程师 一篇关于 Web Worker、SharedArrayBuffer、Atomics 的文章。 为什么要多线程编程 大家看到文章的标题《Javascript 多线程编程》可能立马会产生疑问：Javascript 不是单线程的吗？Javascript IO 阻塞和其他异步的需求（例如 setTimeout, Promise, requestAnimationFrame, queueMicrotask 等）不是通过事件循环（Event Loop）来
本文将介绍 Broadcast Channel API 的基本和高级使用方法，并提供示例代码来帮助读者更好地理解和使用该 API。
最近，我们团队完成了 Figma 插件 API 的开发工作，这样第三方开发人员就可以直接在基于浏览器的设计工具中运行代码。这为第三方开发人员带来便利的同时，也给我们带来许多严峻挑战，比如，如何确保插件中运行的代码不会带来安全问题？
在《我们是如何将 Cordova 应用嵌入到 React Native 中》 一文中，我们简单地介绍了『React Native 重写 Cordova 插件：复杂插件的调用』步骤： WebView 调用 RN 方法，并监听 React Native 返回的相应事件 React Native 接收到 WebView 的调用，调用原生代码，并监听原生代码返回的相应事件 原生代码执行 React Native 调用的方法，并响应事件给 React Native React Native 接收到原生代码的值，执行
原文：https://www.figma.com/blog/how-we-built-the-figma-plugin-system/
很多人都知道，setTimeout 是有最小延迟时间的，根据 MDN 文档 setTimeout：实际延时比设定值更久的原因：最小延迟时间 中所说：
很多人都知道，setTimeout 是有最小延迟时间的，根据 MDN 文档 setTimeout：实际延时比设定值更久的原因：最小延迟时间[1] 中所说：
近年来，随着移动端对数据可视化的要求越来越高，类似 MPAndroidChart 这样的传统图表库已经不能满足产品经理日益变态的需求。前端领域数据可视化的发展相对繁荣一些，通过 WebView 在移动端使用 Echarts 这样功能强大的前端数据可视化库，是解决问题的好办法。
新，会自上而下逐渐刷新整个子孙组件，这样性能损耗重复渲染就会多出很多，所以我们不仅要单一数据来源控制组件刷新，偶尔还需要在shouldComponentUpdate中对比nextProps和this.props 以及this.state以及nextState.
TDesign 是腾讯各业务团队在服务业务过程中沉淀的一套企业级设计体系，具有统一的价值观，一致的设计语言和视觉风格，帮助用户形成连续、统一的体验认知。在此基础上，TDesign 提供了开箱即用的 UI 组件库、设计指南 和相关设计资产，以优雅高效的方式将设计和研发从重复劳动中解放出来，同时方便大家在 TDesign 的基础上扩展，更好的的贴近业务需求。
在团队降本提效的基建中，洛竹开发了一款 vscode 插件，第一版我使用的是 vscode 内置 UI，虽说也能用，但是用户体验欠佳。由于 vscode 内置 UI 不够灵活，一番调研后我决定使用 webview 重构。
假如你的WebView 是从 react-native 里引用的话.H5 向 RN 发消息则使用window.postMessage(message) 为了减少React Native的表面积，<WebView/>将从React Native核心中删除,推荐使用
D2C 是指 Design to Code，设计稿转代码，输入是 sketch、figma、PSD 等设计稿，输出是 vue、react、小程序等各平台的前端代码。
CNode 社区为国内最专业的 Node.js 开源技术社区，致力于 Node.js 的技术研究。本篇将通过实现 VS Code 版 CNode， 来带领大家一起熟悉 VSCode Webview 强大的功能。在开始之前，我们先参考 官网关于 webview 的介绍。Webview API 允许扩展在 visualstudio 代码中创建完全可定制的视图，可以将 webview 看作是 VS Code 中的 iframe。
刚开始只是对接一下RN，h5部分，嵌套在RN里的webview里需要隐藏一些原生的按钮，遇到很多沟通上的问题，本来没使用RN之前，也是嵌套在webview里，也没什么问题，突然RN嵌套就有问题了，对方一直督促h5改动，出于对RN的好奇，和对自己技术的自信，改就改吧，postmessage，这东西也很好，但RN很坑，注入js会有问题，有延迟，h5发送postmessage也有问题，得延迟发送，具体时间还判断不出来，虽然有issue说根据window下的postmessage进行判断，但也是没啥效果，经过很多次沟通，最终由我提出了一个解决方案，如下：
ArcoDesign 是由字节跳动 GIP UED 团队和架构前端团队联合推出的企业级设计系统。在打磨了近 3 年之后，通过字节内部大量业务沉淀和验证，我们开源了 ArcoDesign 设计系统。旨在让社区听见更多的声音，为更多中小型企业及个人设计师和开发者提效，创造更多高效美观的“最佳实践”。
设计稿转代码是一个非常宽泛的描述，本文指的设计稿转代码，同时也是 Semi Design D2C 所提供的能力范围，主要集中在以下场景：
导语 性能调优是一个亘古不变的话题，无论是在传统H5上还是小程序中。因为实现机制不同，可能导致传统H5中的某些优化方式在小程序上并不适用。因此必须另开辟蹊径找出适合小程序的调估方式。 预先加载 这一节
导语 性能调优是一个亘古不变的话题，无论是在传统H5上还是小程序中。因为实现机制不同，可能导致传统H5中的某些优化方式在小程序上并不适用。因此必须另开辟蹊径找出适合小程序的调估方式。 本文旨在介绍两点在小程序开发过程当中碰到的一些性能问题以及 WePY 的一些优化方案。 小程序组件化框架 WePY 介绍请阅读：《打造“微信小程序”组件化开发框架》 预先加载 原理 传统H5中也可以通过预加载来提升用户体验，但在小程序中做到这一点实际上是可以更简单方便却又更容易被忽视的。 传统H5在启动时，page1.htm
event（事件订阅）是react新增的通信方式。它类似webSorcket和postMessage的通信方式，一边发送传值，另一边监听接收. 适合兄弟组件传值
前言： 在React源码解析之scheduleWork（下）中，我们讲到了unstable_scheduleCallback，其中在「按计划插入调度任务」后，会调用requestHostCallback()方法：
大多数App会选择H5去实现某些弱交互但是却需要热更新界面，这时候WebView就派上用场了，那么如何对WebView进行调试呢？
由于浏览器的限制,注定了每个网页只能在一个进程程当中运行, 而且,js又只能运行在一个线程当中. 所以, 作为一名开发者来说, 对于这样的结果就只能呵呵了. 如果你想进行高复杂度的运算, 基本上就可以go die了(只要运行, 你网页基本上就崩掉了). 当然,聪明的W3C早就知道developer心里的小猫腻. 推出了web worker 这个概念. 我们接下来,来正式接触一下 web worker吧. 初入web worker web worker 既然是一个线程. 那必定会设计到线程间的通信. 这里,w
就在前几天,我们讲了两篇关于React 18性能优化和React Server Componment的文章介绍。其中大部分篇幅,都是基于RSC的.
webview是对rn开发的一个重要补充，由于性能原因，旧版自带的webview即将被移除。
Dev Mode 下， Figma 提供开发者导航设计文件和将设计转换为代码的所有信息，开发者与设计师共享同一个文件( 唯一事实源)，从而有效地避免上下游交接中遗漏细节信息。
帮助开发者与设计师协作的工具正成为一种趋势。Figma 和 Canva 一直在宣传他们的开发工具，现在 Penpot 也开始了。
本文副标题是 Request Schedule 源码解析一。在本章中会介绍 requestIdleCallback 的用法以及其缺陷, 接着对 React 团队对该 api 的 hack 部分的源码进行剖析。在下一篇中会结合优先级对 React 的调度算法进行宏观的解释, 欢迎关注个人博客。
Chrome扩展是一种可以在Chrome浏览器中添加新功能和修改浏览器行为的软件程序，例如我们常用的TamperMonkey、Proxy SwitchyOmega、AdGuard等等，这些拓展都是可以通过WebExtensions API来修改、增强浏览器的能力，用来提供一些浏览器本体没有的功能，从而实现一些有趣的事情。
前言 需求背景： 最近开发管理系统，需要在本页面跳转到一个图片管理系统上传图片，上传成功后返回图片链接，然后返回管理系统，显示图片 实现思路： 上传图片时，需要在本窗口跳转到图片管理系统，并且两个系统之间要通信 考虑到两个系统是不同的端口号，存在跨域问题，这时发现HTML5新增了一个API-window.postMessage()，于是就决定用iframe结合window.postMessage()实现 在页面中嵌入一个iframe，将图片管理系统嵌入到当前的管理系统中，结合window.postMessa
git切换源地址 git remote set-url origin newurl css的sticky失效，因为overflow不能是auto 解决英文字符不换行的问题 word-break: break-all react url传值过多导致卡顿问题： 跳转页面后获取数据，或者通过localStorage处理。 64.助销小程序经验总结： h5不能点击按钮分享，小程序可以 wx.invoke不支持，config的beta设为true cos文件下载，a标签浏览器可
背景：父页面index.html里面有一个iframe，iframe的src为子页面(另一个html的链接)，下文都是基于此情况下进行
Chrome Devtools 的 Performance 工具是性能分析和优化的利器，因为它可以记录每一段代码的耗时，进而分析出性能瓶颈，然后做针对性的优化。
在chrome插件中，我们通常会看到在插件端登录操作会跳转到第三方独立的web去登录，一旦web登录，返回到插件端，一刷新页面，插件就自动登录了。这是如何实现的呢？本文是插件与web端的单点登录的一篇总结笔记，希望看完在项目中有所帮助。
前面调研过 D2C，也就是设计稿转代码，它的原理是 figma、sketch 等插件可以拿到设计稿的数据，因为是矢量设计稿，所以存储的是一个 JSON，类似这样：
本文来自公众号【前端早读课】，最近工作中用在使用 postMessage ，所以一起分享给大家一下~
在我们日常使用中，会安装很多插件，如： 主题、Prettier、code snippets、Eslint、Jest Runner、Git等等。每种插件都能解决我们实际开发中的某一块诉求。我把所有的插件大致归为三类：UX/UI类、语言类、工具类
在酷家乐云设计工具推出插件化二开系统之前，基于 HTTP 的 OpenAPI 已经运作多年，很多客户使用 OpenAPI 把我们的 SaaS 服务和自己的信息系统集成到了一起。这部分客户因此可以将自己的业务流程运行得更加简单和高效。这也是 OpenAPI 的特点，擅长在不同系统间做数据上的对接和系统的集成。而在另一方面，越来越多的需求指向了一个方向：客户希望在酷家乐中扩展功能。这让我们开始考虑为酷家乐提供一个插件系统，允许第三方开发者开发在酷家乐内运行的功能。我们在 2021 年启动了这个项目，并将这套插件系统取了个对外的名称，叫做酷家乐工具小程序。
首先结合React-Native 高版本与低版本（0.41.2 与 0.25.1）分析其RN源码（偏向于Android方向）及api
在日常工作中，诸如像扣像素、调布局这些繁琐、枯燥的体力活都将得到极大的削减，原来 8 小时的工作量只需要 10 来分钟即可完成。
Service Worker 很棒。它们使 Web 开发人员可以实现以前原生应用专有的类似功能。这类功能是例如推送通知或后台同步的离线功能。
https://lxfu1.github.io/large-screen-visualization/
在这充满网络促销活动的几个月，倍感压力的，除了你的口袋，是否还有程序员的发量呢？每年的双十一、双十二购物狂欢节，各大电商平台都会上线让消费者充满购买欲望的活动页面，而这些活动页面大多都是静态页面，只是为一些商品提供一个入口，UI设计小姐姐设计完页面之后交给前端程序员，然后程序员就开始无聊繁琐的搬砖。如果有一款神器，可以直接将UI小姐姐的设计稿转换成页面代码，是否能让广大前端开发者大呼万岁？
导语 本文旨在介绍一种简单，优雅，代码侵入性小的web worker引入方式。能够在不影响现有业务逻辑的情况下，快速为你的前端项目引入多线程能力。 一、谈谈Web Worker 众所周知，JavaScript引擎是单线程的，这意味着所有的操作都会在主线程当中发生。 尽管浏览器内核是多线程的，但是负责页面渲染的UI线程总是会在JS引擎线程空闲时（执行完一个macro task）才会执行。 JavaScript的事件队列模型 这意味着如果页面当中包含某些计算密集的代码时，因为JS
领取专属 10元无门槛券
手把手带您无忧上云
