diff --git a/cg/canvas.md b/cg/canvas.md
index d2c5e10..80a83ae 100644
--- a/cg/canvas.md
+++ b/cg/canvas.md
@@ -2,7 +2,28 @@
 
 > 既然是图形库，那一定使用了很多图形学的技术
 
-## path
+## 尺寸
+
+设计会以标准桌面1920X1080来设计和canvas在1920X1080下是1，其他情况下可能有问题。
+
+- 屏幕尺寸，指屏幕的对角线的尺寸，1in=2.54cm
+- 像素，根据语境不同可能有不同的含义
+    - 设备像素，也是物理像素
+    - PPI，pixels per inch指每英寸的像素数目，用于度量设备像素密度
+    - DPI，dots per inch指每英寸点数，用于度量空间点的密度
+    - 理论上，PPI = sqrt(w^2 + h^2) / d, 其中w是水平上的像素数，h是竖直方向的像素数，d是屏幕尺寸，如21英寸的1920*1680的PPI=Math.sqrt(1920*1920+1680*1680)/21=121.49
+    - CSS像素，devicePixelRatio, 编程语言中的概念，用于表示逻辑上的像素，是设备上物理像素和设备独立像素device-independent-pixel的比值，
+    - device-independent-pixel，设备独立像素，也叫做逻辑像素，一种基于计算机坐标系统的物理单位，应用程序将独立像素告诉操作系统系统，操作系统将独立设备像素转换为物理像素。
+- 分辨率，泛指系统对细节的分辨能力
+    - 屏幕分辨率，屏幕像素的像素总数
+        - 物理分辨率，是固定的，不可变的
+        - 显示器分辨率，由操作系统设定的，
+    - 图像分辨率，单位英寸中所包含的像素总数
+
+
+## 元素信息
+
+### path
 
 - [Cocoa Drawing Guide, Paths苹果关于winding rules to path](https://developer.apple.com/library/archive/documentation/Cocoa/Conceptual/CocoaDrawingGuide/Paths/Paths.html)
 
@@ -12,10 +33,10 @@
 
 判断自相交，多边形在平面内的除顶点外还有其他公共点
 
-### Non-Zero Winding Number Rule
+#### Non-Zero Winding Number Rule
 使多边形的边变成矢量，将环绕数初始化为0，从该点p做任意方向的一条射线，当从p点沿射线方向移动时，对在每个方向上穿过射线的边计数，当多边形的边从左到右穿过射线时，环绕数加1，从右到左时，环绕数减1.遍历完多边形所有相关边之后，若环绕数非零，则p为内部点interior，否则为外部点。
 
-### Odd-even Rule
+#### Odd-even Rule
 从该点p任意方向的一条射线，若与该射线相交的多边形边数的数目为奇数，则p是多边形内部点，否则是外部点。即奇数在内，偶数在外。
 
 图形是否填充就需要Even-Odd Rule和winding Rule结合来判断
@@ -27,7 +48,7 @@ CanvasRenderingContext2D.isPointInPath()
 ```
 ![Applying winding rules to a path](https://developer.apple.com/library/archive/documentation/Cocoa/Conceptual/CocoaDrawingGuide/Art/winding_path_crossing_2x.png)
 
-## rotate 
+### rotate 
 
 常规的旋转，很少使用矩阵，[利用 ImageData 实现图片左右旋转 90°](https://blog.csdn.net/frgod/article/details/106055830)
 
diff --git a/cpl/cplusplus.md b/cpl/cplusplus.md
index 5576a89..611dc60 100644
--- a/cpl/cplusplus.md
+++ b/cpl/cplusplus.md
@@ -4,6 +4,15 @@
     - [The C++ Core Guidelines are a collaborative effort led by Bjarne Stroustrup, much like the C++ language itself. They are the result of many person-years of discussion and design across a number of organizations.](https://github.com/isocpp/CppCoreGuidelines)
     - [The Guidelines Support Library (GSL) contains functions and types that are suggested for use by the C++ Core Guidelines maintained by the Standard C++ Foundation. This repo contains Microsoft's implementation of GSL.](https://github.com/Microsoft/GSL)
 
+## 语言特性
+
+### 头文件
+未避免头文件多次被编译，C/C++中有两种方法来避免，一种是 header include guards，一种是#pragma once
+
+- header include guards，标准文件方法，它不能区分相同的macro名称在一个或多个文件中重名，可能造成问题
+- [pragma](https://en.cppreference.com/w/cpp/preprocessor/impl)，在文件系统层面上标识文件，但不能保证多个文件的存在
+
+
 ## TMP(template metaprogramming)
 
 可参考的内容
diff --git a/cpl/js/lmj.js b/cpl/js/lmj.js
new file mode 100644
index 0000000..f03364a
--- /dev/null
+++ b/cpl/js/lmj.js
@@ -0,0 +1,31 @@
+let p2023Q4 = [
+    0.3,
+    0.05,
+    0.03,
+    0.15,
+    0.20,
+    0.12,
+    0.05,
+    0.05,
+    0.03,
+    0.02,
+];
+let r2023Q4 = [
+    90,
+    100,
+    100,
+    50,
+    0,
+    98,
+    100,
+    100,
+    100,
+    100,
+]
+const score = p2023Q4.reduce((pv,cv,i)=>{
+    const r1 = cv * r2023Q4[i];
+    const r2 = pv + r1;
+    console.log(r1, r2);
+    return r2;
+}, 0)
+console.log('total -- ', score);
\ No newline at end of file
diff --git a/dev-note/git.md b/dev-note/git.md
index 37520cc..d880747 100644
--- a/dev-note/git.md
+++ b/dev-note/git.md
@@ -2,6 +2,7 @@
 
 [官方文档](https://git-scm.com/docs)
 [中文官方文档](https://git-scm.com/book/zh/v2)
+[A successful Git branching model](https://nvie.com/posts/a-successful-git-branching-model/)
 
 ## 常用命令
 
diff --git a/dev-note/license.md b/dev-note/license.md
new file mode 100644
index 0000000..e3c9c5a
--- /dev/null
+++ b/dev-note/license.md
@@ -0,0 +1,4 @@
+# License
+
+[Licensecc -- a C++ software license manager](https://github.com/open-license-manager/licensecc)
+
diff --git a/index/books.md b/index/books.md
index 9c1d71e..f3ee6dc 100644
--- a/index/books.md
+++ b/index/books.md
@@ -11,6 +11,11 @@
 
 - [what every programmer should know about memory](https://people.freebsd.org/~lstewart/articles/cpumemory.pdf)
 
+## 数学
+
+- [Introduction to Modern Statistics (2nd Ed)现代统计学](https://openintro-ims2.netlify.app/)
+
+
 ## 设计
 
 - 计算机图形图像设计，2016，中国传媒大学出版社，已读
diff --git a/index/computerScience.md b/index/computerScience.md
index aecd88d..1dc198f 100644
--- a/index/computerScience.md
+++ b/index/computerScience.md
@@ -87,6 +87,7 @@
 - [Magnum — Lightweight and modular C++11/C++14 graphics middleware for games and data visualization](https://github.com/mosra/magnum)
 - [Hazel is primarily an early-stage interactive application and rendering engine for Windows.](https://github.com/TheCherno/Hazel)
 
+- [Blend2D -- 2D Vector Graphics Powered by a JIT Compiler.](https://github.com/blend2d/blend2d)
 
 #### threejs
 
diff --git a/index/online.md b/index/online.md
index ccf2fc1..4a0b2c7 100644
--- a/index/online.md
+++ b/index/online.md
@@ -33,6 +33,7 @@
 - [A Graphics Guy's Note](https://agraphicsguynotes.com/posts/)
 - [figma的博客,有关figma实现的一些思路和总结,值得借鉴](https://www.figma.com/blog/)
 
+
 ## 工具
 
 ### 文档
diff --git a/web/html.md b/web/html.md
index e0869bc..b793e77 100644
--- a/web/html.md
+++ b/web/html.md
@@ -16,6 +16,10 @@
 <input onfocus=this.blur()> <!-- 这样代码内部可以修改，相比readonly -->
 ```
 
+#### range
+
+[Styling range input with CSS and JavaScript for better UX](https://nikitahl.com/style-range-input-css)
+
 ### form
 
 在开发中form的提交表单很舒服,主要使用浏览器自带的属性required和disabled,但是使用时务必注意到使用button的submit提交时,