跳到主要内容

解析基于 core-js 与 ESLint 的 Web 兼容方案

· 阅读需 7 分钟
不如怀念
Web 前端工程师 (Web Front-end Engineer)
最后更新于 2021-12-08 21:12:00

Web 网页为了保证在多个平台和低中高端设备上的体验稳定性和一致性,通常会做 Polyfill 以保证兼容性。

然而,兼容性问题本身是个难题,Polyfill 也并非很好处理,所以在技术演变的过程中,社区达成了一致,有一个主流的方案,大家共同来使用和维护。当下社区的主流方案则是基于 core-js,另一方面, 利用 ESLint 插件则可以做到自动检测代码中需要添加 Polyfill 的 API。

core-js 只是解决了 JavaScript 的兼容性问题,Web 网页还有 CSS / HTML / Web API 的兼容性问题,处理这些问题的过程中,必然会存在大量相似的逻辑,比如目标设备的检测、目标设备的 API 支持情况统计。当然,社区也给出了非常好的方案,下面就来了解一下。

UNIX传奇:历史与回忆

· 阅读需 13 分钟
不如怀念
Web 前端工程师 (Web Front-end Engineer)
最后更新于 2021-12-05 16:47:00

对于经常看纯技术书籍的人来说,难免会感觉到烦闷,阅读纯技术书籍的过程通常是非常消耗人的,不像看小说,是一个享受和放松的过程。所以,借此机会,找到一本与技术相关但并非纯粹的技术教程类书,讲解了 UNIX 诞生的历史和之后发展壮大的过程,虽然相比于小说还是略有枯燥,但其中也不乏精彩之处,对于一个技术研发成果,从多个角度阐述和讨论,也会让作为从事技术开发工作的人来说有一定的启发。

Web 前端调试工具:SourceMap 文件

· 阅读需 6 分钟
不如怀念
Web 前端工程师 (Web Front-end Engineer)
最后更新于 2022-05-07 21:57:00

Web 前端项目出于加载性能优化和安全考虑,在生产环境部署的代码是经过混淆和压缩的,对于利用生产环境收集到的错误堆栈信息要进行调试是非常具有挑战性的。理想情况下,应该在生产环境收集错误堆栈信息,然后映射到源码进行调试。恰好,SourceMap 文件提供了这个机制,可以将编译(压缩)后的代码映射到源代码中。

Web 应用:轻量级状态管理工具 zustand

· 阅读需 13 分钟
不如怀念
Web 前端工程师 (Web Front-end Engineer)
最后更新于 2021-11-18 00:14:00

基于 React.js 的 Web 应用如何完成状态管理?社区主流方案是 react-redux,其本质上基于 React 的 Context 特性实现,如果应用足够简单,实际上用 Context 手写一个简单的状态管理工具倒也并不难。不过,考虑到工具的完善性、项目的健壮性,通常采用较好的、成熟的社区方案。在移动端场景下,react-redux 略显臃肿,轻量级状态管理工具 zustand 倒是一个不错的替代方案。

又读村上春树

· 阅读需 4 分钟
不如怀念
Web 前端工程师 (Web Front-end Engineer)
最后更新于 2021-11-15 00:59:00

最近,在新工作逐渐稳定进入正轨时,业务上也稍忙一些,也经历了一些人和事,年初订的计划其实有被打乱的。另一方面,也导致近期比较焦虑,而且业余时间很难集中精力研究和学习新的东西,非常容易被娱乐的东西所吸引。当然,每到此时,我首先想到的便是看书,以此让自己静下心来,而小说一般来说是最好的。

周末了,打开京东读书,恰好看到送的一本小说,是村上春树先生的《黑夜以后》。其实,之前看过先生很著名的作品《挪威的森林》,确实觉得不错,之后又看了《海边的卡夫卡》,感觉更甚。这不,直接毫不犹豫的就看了起来,却不曾料到,3 个小时就看完了。

谈谈新工作

· 阅读需 3 分钟
不如怀念
Web 前端工程师 (Web Front-end Engineer)
最后更新于 2021-11-07 14:16:00

新工作将满半年,作为一个工作四年左右的人来说,很快的适应新工作并投入其中,算不上什么新鲜事,也不值一提。为什么这么说呢,大抵是因为虽然技术有进步,但职级却没有太大进步,当然现阶段来看这也是没有办法的事情。

Web 前端性能优化:批量 DOM 操作 - FastDOM

· 阅读需 8 分钟
不如怀念
Web 前端工程师 (Web Front-end Engineer)
最后更新于 2022-03-10 00:28:00

利用 JS 开发的原生应用与依赖于 React.js/Vue 开发的框架/库应用,性能孰高孰低?这两者最显著的区别在于原生应用需要手动操作 DOM 完成业务,而框架/库应用是基于数据变化响应式的应用,后者只需要关注数据如何变化,至于体现在 DOM 上的变化皆由框架/库内部自动完成。所以,要搞清楚两者的性能优劣,可能批量的 DOM 操作是一个不可忽略的核心因素。从代码执行的角度分析,框架/库也是基于原生 API 进行的封装抽象,因此代码执行时的路径更长、堆栈更深,由此可见原生 API 的操作性能应该是最高的。但是,现实情况是业务通常来说是复杂的,代码实现中 DOM 操作的逻辑分散在各处,那么多个 DOM 操作之间是否会产生影响从而不利于性能?这个时候就要关注宿主浏览器的渲染机制是如何理解批量的 DOM 操作的,这里引入的概念就是关键渲染路径(Critical rendering path)

https://developer.mozilla.org/en-US/docs/Web/Performance/Critical_rendering_path > https://developers.google.com/web/fundamentals/performance/rendering

Web 前端性能优化:案例分析 1

· 阅读需 18 分钟
不如怀念
Web 前端工程师 (Web Front-end Engineer)
最后更新于 2022-03-06 23:28:00

能在真实业务场景中落地 Web 性能优化方案的机会鲜有,大多数时候业务是较为简单而且要求不高的,前段时间恰好有一个比较核心的业务,对稳定性和性能有一定的要求,在这个过程中也算是做了很多尝试和实践,在此作为案例记录一下分析的过程和最终解决的方案。

黑客与画家

· 阅读需 13 分钟
不如怀念
Web 前端工程师 (Web Front-end Engineer)
最后更新于 2021-08-24 01:26:00

这本书在 IT 圈子应该是为人熟知的,这也是我知道存在这本书的原因。不过,从我知道这本书到读完这本书中间还是隔了相当一段时间的,一方面是因为工作后读书的习惯保持的不太好,另一方面也是确实比较忙。幸运的是,最近终于有空来读一读了,当然从开始读这本书到读完也是断断续续好一段时间。

这本书的名字《黑客与画家》乍一听让很多人摸不着头脑,包括我在内刚开始也猜不到这本书的内容主题是什么。然而,作为 IT 从业者,“黑客”一词对我们绝对有足够的吸引力,至少会让很多人产生了解一下的想法。这本书本身是作者写的一系列较受欢迎的文章的集合,在读完这本书之后我相信对于 IT 从业者,至少是有一定工作经验的人来说是值得读的一本书,也许会对目前的认知有所改变和产生新的认识。