Deploying to master from @ cd45cea 🚀

godbasin · Nov 25, 2023 · 464513a · 464513a
1 parent ba3bbe4
commit 464513a
Show file tree

Hide file tree

Showing 394 changed files with 869 additions and 837 deletions.
diff --git a/404.html b/404.html
@@ -8,11 +8,11 @@
 
     <meta name="description" content="Just playing around">
 
-    <link rel="preload" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css" as="style"><link rel="preload" href="/front-end-playground/assets/js/app.b1e54c87.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/5.d67042e7.js" as="script">
+    <link rel="preload" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css" as="style"><link rel="preload" href="/front-end-playground/assets/js/app.f70ad185.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/5.d67042e7.js" as="script">
     <link rel="stylesheet" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css">
   </head>
   <body>
-    <div id="app" data-server-rendered="true"><div class="theme-container"><div class="theme-default-content"><h1>404</h1> <blockquote>There's nothing here.</blockquote> <a href="/front-end-playground/" class="router-link-active">Take me home.</a></div></div><div class="global-ui"></div></div>
-    <script src="/front-end-playground/assets/js/app.b1e54c87.js" defer></script><script src="/front-end-playground/assets/js/5.d67042e7.js" defer></script>
+    <div id="app" data-server-rendered="true"><div class="theme-container"><div class="theme-default-content"><h1>404</h1> <blockquote>That's a Four-Oh-Four.</blockquote> <a href="/front-end-playground/" class="router-link-active">Take me home.</a></div></div><div class="global-ui"></div></div>
+    <script src="/front-end-playground/assets/js/app.f70ad185.js" defer></script><script src="/front-end-playground/assets/js/5.d67042e7.js" defer></script>
   </body>
 </html>
diff --git a/README.md b/README.md
@@ -5,6 +5,7 @@
 
 ## 最近更新
 
+- [《复杂渲染引擎架构与设计--8.元素与事件》](https://godbasin.github.io/front-end-playground/front-end-basic/render-engine/render-engine-element-and-event.html)    
 - [《复杂渲染引擎架构与设计--7.离屏渲染》](https://godbasin.github.io/front-end-playground/front-end-basic/render-engine/render-engine-offscreen-render.html)    
 - [《复杂渲染引擎架构与设计--6.增量渲染》](https://godbasin.github.io/front-end-playground/front-end-basic/render-engine/render-engine-diff-render.html)    
 - [《复杂渲染引擎架构与设计--5.分片计算》](https://godbasin.github.io/front-end-playground/front-end-basic/render-engine/render-engine-calculate-split.html)    

diff --git a/angular/angular-free/0-about-angular-from-1-to-4.html b/angular/angular-free/0-about-angular-from-1-to-4.html
@@ -8,7 +8,7 @@
 
     <meta name="description" content="Just playing around">
 
-    <link rel="preload" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css" as="style"><link rel="preload" href="/front-end-playground/assets/js/app.b1e54c87.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/2.775d56f2.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/3.c15c8d98.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/8.ab420965.js" as="script">
+    <link rel="preload" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css" as="style"><link rel="preload" href="/front-end-playground/assets/js/app.f70ad185.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/2.ec53f3d8.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/3.c15c8d98.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/8.2c39bf99.js" as="script">
     <link rel="stylesheet" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css">
   </head>
   <body>
@@ -64,7 +64,7 @@
           谈谈 Angular 的依赖注入
         </a>
         →
-      </span></p></div>  <div class="gitalk-container theme-default-content"><div id="gitalk-container" class="content"></div></div></main> <div id="kitty-container"><span><div role="tooltip" id="el-popover-6395" aria-hidden="true" class="el-popover el-popper" style="width:undefinedpx;display:none;"><!----><img src="https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/2code2.jpg" class="image"> <div class="text">牡羊猪的猫粮罐</div> </div><span class="el-popover__reference-wrapper"><div id="kitty" style="background:url(https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/assets/img/kitty0.svg);"></div></span></span> <div class="el-dialog__wrapper" style="display:none;"><div role="dialog" aria-modal="true" aria-label="牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）" class="el-dialog" style="margin-top:15vh;"><div class="el-dialog__header"><span class="el-dialog__title">牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）</span><button type="button" aria-label="Close" class="el-dialog__headerbtn"><i class="el-dialog__close el-icon el-icon-close"></i></button></div><!----><!----></div></div></div></div><div class="global-ui"></div></div>
-    <script src="/front-end-playground/assets/js/app.b1e54c87.js" defer></script><script src="/front-end-playground/assets/js/2.775d56f2.js" defer></script><script src="/front-end-playground/assets/js/3.c15c8d98.js" defer></script><script src="/front-end-playground/assets/js/8.ab420965.js" defer></script>
+      </span></p></div>  <div class="gitalk-container theme-default-content"><div id="gitalk-container" class="content"></div></div></main> <div id="kitty-container"><span><div role="tooltip" id="el-popover-503" aria-hidden="true" class="el-popover el-popper" style="width:undefinedpx;display:none;"><!----><img src="https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/2code2.jpg" class="image"> <div class="text">牡羊猪的猫粮罐</div> </div><span class="el-popover__reference-wrapper"><div id="kitty" style="background:url(https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/assets/img/kitty1.svg);"></div></span></span> <div class="el-dialog__wrapper" style="display:none;"><div role="dialog" aria-modal="true" aria-label="牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）" class="el-dialog" style="margin-top:15vh;"><div class="el-dialog__header"><span class="el-dialog__title">牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）</span><button type="button" aria-label="Close" class="el-dialog__headerbtn"><i class="el-dialog__close el-icon el-icon-close"></i></button></div><!----><!----></div></div></div></div><div class="global-ui"></div></div>
+    <script src="/front-end-playground/assets/js/app.f70ad185.js" defer></script><script src="/front-end-playground/assets/js/2.ec53f3d8.js" defer></script><script src="/front-end-playground/assets/js/3.c15c8d98.js" defer></script><script src="/front-end-playground/assets/js/8.2c39bf99.js" defer></script>
   </body>
 </html>
diff --git a/angular/angular-free/0-di-in-angular.html b/angular/angular-free/0-di-in-angular.html
@@ -8,7 +8,7 @@
 
     <meta name="description" content="Just playing around">
 
-    <link rel="preload" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css" as="style"><link rel="preload" href="/front-end-playground/assets/js/app.b1e54c87.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/2.775d56f2.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/3.c15c8d98.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/9.b5715a5e.js" as="script">
+    <link rel="preload" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css" as="style"><link rel="preload" href="/front-end-playground/assets/js/app.f70ad185.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/2.ec53f3d8.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/3.c15c8d98.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/9.566a71c9.js" as="script">
     <link rel="stylesheet" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css">
   </head>
   <body>
@@ -47,7 +47,7 @@
           1. 用 Webpack 启动 Angular 应用
         </a>
         →
-      </span></p></div>  <div class="gitalk-container theme-default-content"><div id="gitalk-container" class="content"></div></div></main> <div id="kitty-container"><span><div role="tooltip" id="el-popover-7779" aria-hidden="true" class="el-popover el-popper" style="width:undefinedpx;display:none;"><!----><img src="https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/2code2.jpg" class="image"> <div class="text">牡羊猪的猫粮罐</div> </div><span class="el-popover__reference-wrapper"><div id="kitty" style="background:url(https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/assets/img/kitty2.svg);"></div></span></span> <div class="el-dialog__wrapper" style="display:none;"><div role="dialog" aria-modal="true" aria-label="牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）" class="el-dialog" style="margin-top:15vh;"><div class="el-dialog__header"><span class="el-dialog__title">牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）</span><button type="button" aria-label="Close" class="el-dialog__headerbtn"><i class="el-dialog__close el-icon el-icon-close"></i></button></div><!----><!----></div></div></div></div><div class="global-ui"></div></div>
-    <script src="/front-end-playground/assets/js/app.b1e54c87.js" defer></script><script src="/front-end-playground/assets/js/2.775d56f2.js" defer></script><script src="/front-end-playground/assets/js/3.c15c8d98.js" defer></script><script src="/front-end-playground/assets/js/9.b5715a5e.js" defer></script>
+      </span></p></div>  <div class="gitalk-container theme-default-content"><div id="gitalk-container" class="content"></div></div></main> <div id="kitty-container"><span><div role="tooltip" id="el-popover-7948" aria-hidden="true" class="el-popover el-popper" style="width:undefinedpx;display:none;"><!----><img src="https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/2code2.jpg" class="image"> <div class="text">牡羊猪的猫粮罐</div> </div><span class="el-popover__reference-wrapper"><div id="kitty" style="background:url(https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/assets/img/kitty0.svg);"></div></span></span> <div class="el-dialog__wrapper" style="display:none;"><div role="dialog" aria-modal="true" aria-label="牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）" class="el-dialog" style="margin-top:15vh;"><div class="el-dialog__header"><span class="el-dialog__title">牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）</span><button type="button" aria-label="Close" class="el-dialog__headerbtn"><i class="el-dialog__close el-icon el-icon-close"></i></button></div><!----><!----></div></div></div></div><div class="global-ui"></div></div>
+    <script src="/front-end-playground/assets/js/app.f70ad185.js" defer></script><script src="/front-end-playground/assets/js/2.ec53f3d8.js" defer></script><script src="/front-end-playground/assets/js/3.c15c8d98.js" defer></script><script src="/front-end-playground/assets/js/9.566a71c9.js" defer></script>
   </body>
 </html>
diff --git a/angular/angular-free/1-init-angular-app-with-webpack.html b/angular/angular-free/1-init-angular-app-with-webpack.html
@@ -8,7 +8,7 @@
 
     <meta name="description" content="Just playing around">
 
-    <link rel="preload" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css" as="style"><link rel="preload" href="/front-end-playground/assets/js/app.b1e54c87.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/2.775d56f2.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/3.c15c8d98.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/10.8f58fa8c.js" as="script">
+    <link rel="preload" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css" as="style"><link rel="preload" href="/front-end-playground/assets/js/app.f70ad185.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/2.ec53f3d8.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/3.c15c8d98.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/10.8f58fa8c.js" as="script">
     <link rel="stylesheet" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css">
   </head>
   <body>
@@ -136,7 +136,7 @@
           2. 改善应用配置
         </a>
         →
-      </span></p></div>  <div class="gitalk-container theme-default-content"><div id="gitalk-container" class="content"></div></div></main> <div id="kitty-container"><span><div role="tooltip" id="el-popover-8849" aria-hidden="true" class="el-popover el-popper" style="width:undefinedpx;display:none;"><!----><img src="https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/2code2.jpg" class="image"> <div class="text">牡羊猪的猫粮罐</div> </div><span class="el-popover__reference-wrapper"><div id="kitty" style="background:url(https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/assets/img/kitty1.svg);"></div></span></span> <div class="el-dialog__wrapper" style="display:none;"><div role="dialog" aria-modal="true" aria-label="牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）" class="el-dialog" style="margin-top:15vh;"><div class="el-dialog__header"><span class="el-dialog__title">牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）</span><button type="button" aria-label="Close" class="el-dialog__headerbtn"><i class="el-dialog__close el-icon el-icon-close"></i></button></div><!----><!----></div></div></div></div><div class="global-ui"></div></div>
-    <script src="/front-end-playground/assets/js/app.b1e54c87.js" defer></script><script src="/front-end-playground/assets/js/2.775d56f2.js" defer></script><script src="/front-end-playground/assets/js/3.c15c8d98.js" defer></script><script src="/front-end-playground/assets/js/10.8f58fa8c.js" defer></script>
+      </span></p></div>  <div class="gitalk-container theme-default-content"><div id="gitalk-container" class="content"></div></div></main> <div id="kitty-container"><span><div role="tooltip" id="el-popover-6455" aria-hidden="true" class="el-popover el-popper" style="width:undefinedpx;display:none;"><!----><img src="https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/2code2.jpg" class="image"> <div class="text">牡羊猪的猫粮罐</div> </div><span class="el-popover__reference-wrapper"><div id="kitty" style="background:url(https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/assets/img/kitty1.svg);"></div></span></span> <div class="el-dialog__wrapper" style="display:none;"><div role="dialog" aria-modal="true" aria-label="牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）" class="el-dialog" style="margin-top:15vh;"><div class="el-dialog__header"><span class="el-dialog__title">牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）</span><button type="button" aria-label="Close" class="el-dialog__headerbtn"><i class="el-dialog__close el-icon el-icon-close"></i></button></div><!----><!----></div></div></div></div><div class="global-ui"></div></div>
+    <script src="/front-end-playground/assets/js/app.f70ad185.js" defer></script><script src="/front-end-playground/assets/js/2.ec53f3d8.js" defer></script><script src="/front-end-playground/assets/js/3.c15c8d98.js" defer></script><script src="/front-end-playground/assets/js/10.8f58fa8c.js" defer></script>
   </body>
 </html>
diff --git a/angular/angular-free/10-add-conditions.html b/angular/angular-free/10-add-conditions.html
@@ -8,7 +8,7 @@
 
     <meta name="description" content="Just playing around">
 
-    <link rel="preload" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css" as="style"><link rel="preload" href="/front-end-playground/assets/js/app.b1e54c87.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/2.775d56f2.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/3.c15c8d98.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/11.6d147c7b.js" as="script">
+    <link rel="preload" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css" as="style"><link rel="preload" href="/front-end-playground/assets/js/app.f70ad185.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/2.ec53f3d8.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/3.c15c8d98.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/11.6d147c7b.js" as="script">
     <link rel="stylesheet" href="/front-end-playground/assets/css/0.styles.0d5b01aa.css">
   </head>
   <body>
@@ -195,7 +195,7 @@
           11. 使用动态表单制作选项配置对话框
         </a>
         →
-      </span></p></div>  <div class="gitalk-container theme-default-content"><div id="gitalk-container" class="content"></div></div></main> <div id="kitty-container"><span><div role="tooltip" id="el-popover-6432" aria-hidden="true" class="el-popover el-popper" style="width:undefinedpx;display:none;"><!----><img src="https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/2code2.jpg" class="image"> <div class="text">牡羊猪的猫粮罐</div> </div><span class="el-popover__reference-wrapper"><div id="kitty" style="background:url(https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/assets/img/kitty0.svg);"></div></span></span> <div class="el-dialog__wrapper" style="display:none;"><div role="dialog" aria-modal="true" aria-label="牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）" class="el-dialog" style="margin-top:15vh;"><div class="el-dialog__header"><span class="el-dialog__title">牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）</span><button type="button" aria-label="Close" class="el-dialog__headerbtn"><i class="el-dialog__close el-icon el-icon-close"></i></button></div><!----><!----></div></div></div></div><div class="global-ui"></div></div>
-    <script src="/front-end-playground/assets/js/app.b1e54c87.js" defer></script><script src="/front-end-playground/assets/js/2.775d56f2.js" defer></script><script src="/front-end-playground/assets/js/3.c15c8d98.js" defer></script><script src="/front-end-playground/assets/js/11.6d147c7b.js" defer></script>
+      </span></p></div>  <div class="gitalk-container theme-default-content"><div id="gitalk-container" class="content"></div></div></main> <div id="kitty-container"><span><div role="tooltip" id="el-popover-7170" aria-hidden="true" class="el-popover el-popper" style="width:undefinedpx;display:none;"><!----><img src="https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/2code2.jpg" class="image"> <div class="text">牡羊猪的猫粮罐</div> </div><span class="el-popover__reference-wrapper"><div id="kitty" style="background:url(https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/assets/img/kitty1.svg);"></div></span></span> <div class="el-dialog__wrapper" style="display:none;"><div role="dialog" aria-modal="true" aria-label="牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）" class="el-dialog" style="margin-top:15vh;"><div class="el-dialog__header"><span class="el-dialog__title">牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）</span><button type="button" aria-label="Close" class="el-dialog__headerbtn"><i class="el-dialog__close el-icon el-icon-close"></i></button></div><!----><!----></div></div></div></div><div class="global-ui"></div></div>
+    <script src="/front-end-playground/assets/js/app.f70ad185.js" defer></script><script src="/front-end-playground/assets/js/2.ec53f3d8.js" defer></script><script src="/front-end-playground/assets/js/3.c15c8d98.js" defer></script><script src="/front-end-playground/assets/js/11.6d147c7b.js" defer></script>
   </body>
 </html>