技术爱好者周刊(第6期)

 

前端一些内存泄漏的定位和方案! 张泰玮

  1. 内存泄漏原因:代码错误如全局变量、闭包、事件监听器未清理导致内存无法回收。
  2. 排查工具:Chrome DevTools的Performance和Memory面板,堆快照比较,Allocation instrumentation追踪。
  3. 解决策略:移除不必要监听器,管理全局变量,避免循环引用,合理使用插件和定时器。


AlaSQL.js:用SQL解锁JavaScript数据操作的魔法 车泽民

使用sql语句查询数据在前端,挺有意思的,能否用来提升一些场景查询性能? 目前star挺高的。


手撸一个星系,送给心爱的姑娘!(Three.js Shader 粒子系统实现) 郭兵宇

体验一下 Three.js Shader 粒子系统实现,手撸一个星系,送给心爱的姑娘😊。


开发chrome V3插件 陆欣

用vue写chrome插件的流程从0到1。


图解「浏览器渲染原理」 刘世豪

浏览器中的“渲染”指的是将HTML字符串转化为屏幕上的像素信息的过程。

  • 整个过程可总结为以下几步:
  • 解析HTML:将字符串解析成DOM树和CSSOM树
  • 样式计算:得到Computed Style
  • 布局:产生布局树
  • 分层:划分图层
  • 绘制:产生绘制指令集
  • 分块:划分区域
  • 光栅化:生成位图
  • 画:生成quad,提交硬件,完成成像

什么是中台? 李勇鲁

通俗易懂的了解什么是中台


HTML 拖放 API - Web API | MDN 郭晓旭

最近需要做一个拖放相关的需求。 这篇文章是HTML原生提供的相关API,市面上其他拖放相关插件大部分也基于这些API实现。 文章主要介绍了拖放相关的API和事件。


深入理解函数式编程(上) 崔鹏程

  • 函数式编程是一种历史悠久的编程范式。作为演算法,它的历史可以追溯到现代计算机诞生之前的λ演算,本文希望带大家快速了解函数式编程的历史、基础技术、重要特性和实践法则。
  • 在内容层面,主要使用JavaScript语言来描述函数式编程的特性,并以演算规则、语言特性、范式特性、副作用处理等方面作为切入点,通过大量演示示例来讲解这种编程范式。同时,文末列举比较一些此范式的优缺点,供读者参考。

浏览器中的音视频知识入门 徐堂鑫

ResizeObserver接口可以监视dom元素尺寸的变化,有时候除了浏览器缩放外,一些侧边栏tab的展开收起也会影响某些dom元素尺寸的变化,如果这时候我们想要监听该dom尺寸变化,window.resize事件可能满足不了要求,该情况下可以考虑使用ResizeObserver接口。(由于ResizeObserver的监听可能会在短时间内触发多次,出于性能考虑,建议配合debounce使用)


聊聊Web网页中资源加载的优先级 李文娟

通过调整或设置资源加载的优先级或者先后顺序,可以让页面重要的资源优先加载,让不重要的内容之后加载,以提高页面的访问体验。


HTML tabindex属性与web网页键盘无障碍访问 黄鹤翔

tabindex属性是一个全局属性,所有HTML标签都可以使用。它与键盘访问行为紧密相关,可以提高用户体验,尤其是在鼠标不可用时。 这篇文章详细介绍了tabindex属性的概念、作用和使用场景,对于前端开发者理解和应用tabindex很有帮助。