标签： DOM

读书笔记:《数据可视化实战：使用D3设计交互式图表》 – [美] Scott Murray 著 / 李松峰 译

3 条评论

读完时间：2021 年 11 月 4 日

出版时间：2020 年 9 月

5.2 绑定数据

数据可视化说到底就是把数据映射成图形——输入数据，输出图形。

D3 绑定的数据没有出现在 DOM 中，而是作为该元素的 data 属性保存在内存里。

可以把 d 想象成一个寂寞的小占位值，它需要一点温暖，包括来自和蔼可亲的函数圆括号的拥抱。

"读书笔记:《数据可视化实战：使用D3设计交互式图表》 – [美] Scott Murray 著 / 李松峰 译"继续阅读

如何知道 window 的 load 事件已经触发

2 条评论

背景

为了使页面加载更快，常常将一些不重要的第三方脚本在页面完成加载后进行懒加载。

// 做一些不影响业务的事情
window.addEventListener('load', () => {
  // 懒加载埋点分析
  loadScript({
    url: 'https://www.domain.com/test.js',
    timeout: 10000
  }).then(() => {
    console.log('ok');
  }).catch(console.error);
  // 其他
  // ...
});

"如何知道 window 的 load 事件已经触发"继续阅读

读书笔记:《深入浅出React和Redux》 - 程墨 著

发表评论

读完时间：未完待续（截止 8/31 进度 20%）

出版时间：2017 年 4 月 28 日

1.2 增加一个新的 React 组件

在使用 JSX 的范围内必须要有 React。也就是说，在使用 JSX 的代码文件中，即使代码中并没有直接使用 React，也一定要导入这个 React，这是因为 JSX 最终会被转译成依赖于 React 的表达式。

"读书笔记:《深入浅出React和Redux》 - 程墨 著"继续阅读

浏览器与 Node.js 的事件循环（Event Loop）有何区别？[转]

发表评论

前言

本文我们将会介绍 JavaScript 实现异步的原理，并且了解了在浏览器和 Node.js 中 Event Loop 其实是不相同的。

一、线程与进程

1. 概念

我们经常说 JavaScript 是单线程执行的，指的是一个进程里只有一个主线程，那到底什么是线程？什么是进程？

官方的说法是：进程是 CPU 资源分配的最小单位；线程是 CPU 调度的最小单位。这两句话并不好理解，我们先来看张图。

  • 进程好比图中的工厂，有单独的专属自己的工厂资源。
  • 线程好比图中的工人，多个工人在一个工厂中协作工作，工厂与工人是 1:n 的关系。也就是说一个进程由一个或多个线程组成，线程是一个进程中代码的不同执行路线。
  • 工厂的空间是工人们共享的，这象征一个进程的内存空间是共享的，每个线程都可用这些共享内存。
  • 多个工厂之间独立存在。

"浏览器与 Node.js 的事件循环（Event Loop）有何区别？[转]"继续阅读

使用事件委托提高性能

1 条评论

当需要在大量元素上绑定事件的时候，特别是在动态更新的元素上，这个绑定是既麻烦又消耗性能的一件事。比较好的做法是在它们共同的父级元素上绑定一个事件，在事件冒泡阶段触发相应的效果。这种把一个元素的响应事件函数委托给另一个元素的用法便叫事件委托。

"使用事件委托提高性能"继续阅读