update

exercises/index.md

@@ -0,0 +1,5 @@
+# 习题
+> 典型和分类学习
+
+- [夹逼法](/exercises/sequeezing.md)
+- [二次方程](/exercises/quadratic.equation.md)

exercises/math.primary.md

@@ -0,0 +1,204 @@
+# Web
+
+- [使用过的库](/web/library.md)
+- [正则表达式](/cpl/js/regularExpressions.js)
+- [webassembly](/web/webAssembly.md)
+- [http](/web/http.md)
+- [html](/web/html.md)
+- [css](/web/css.md)
+- [canvas](/cg/canvas.md)
+- [小程序开发](/web/mini.md)
+- [字体](/web/font.md)
+- [框架](/web/framework.md)
+- [测试模块](/web/test.md)
+- [图像处理](/web/ImageManipulation.md)
+- [diff算法原理](/web/diff.md)
+- [FRP-Functional Reactive Programming](/cpl/frp.md)
+- [web](/web.md)
+- [浏览器](/web/browser.md)
+- [html](/web/html.md)
+- [CSS](/web/css.md)
+- [适配屏幕](/web/adapt.screen.md)
+- [font](/web/font.md)    
+- [http](/web/http.md)
+- [nginx](/web/nginx.md)
+- [javascript](/cpl/web/ECMAScript.md)
+
+
+- [Web Check网站分析，分析各种配置，可参考网站的配置](https://web-check.as93.net/)
+- [Draggable objects可拖动的对象网页实现](https://www.redblobgames.com/making-of/draggable/)
+
+
+## WebGL
+
+### [threejs](https://threejs.org/)
+
+- [笔记](/cg/threejs/index.md)
+
+### [BabylonJS](https://www.babylonjs.com/)
+
+- [笔记](/cg/babylonjs/index.md)
+
+## library
+
+### 多语言
+> i18n是国际化的英文为 internationalization，为了方便，通常会简写为 i18n（开头的 i、中间的 18 个字符、末尾的 n）
+
+分三类信息，
+- message，文本的替换
+- date time format，时间日期的格式
+- number，数字格式，货币形式等
+
+但难点还是很多的：
+- 多语言的没有标准，使用起来就存在各种兼容的问题，如中文有zh,zh_CN等来区分中文， 可参考BCP 47，全称为Best Current Practice for Tags for the Identification of Languages，是一个基于RFC 5646标准的语言标签格式的建议标准。
+- 多语言还是影响视觉设计，开发时就需要考虑这些问题，不同语言的表述会导致字符的长度差异较大
+- 语言的字段是复用还是语义化，都是一个难点，随着需求的变化可能会有很大的影响
+- 符合用户习惯与不同文化的需求
+
+
+#### **vue**
+
+把i18n实列对象放入Vue的实例中，通过this.$i18n.locale='zh'来设置对应的语言
+
+也可以存储在store或cookie中，
+
+但对惰性组件，如echarts这类需要重新渲染的，就需要手动处理了，方法有：
+- 利用watch监听locale字段是否发现变化，主动调用重新渲染
+- locale变化时直接this.reload强制刷新页面
+
+```js 
+new Vuei81n({
+    locale:'',
+    messages: {}, // $t(path)
+    numberFormats: {}, // $n()
+    dateTimeFormats: {}, // $d()
+})
+```
+
+### 引导库
+
+- [driver.js官网](https://driverjs.com/)
+    - [Driver.js，Powerful, highly customizable vanilla JavaScript engine to drive the user's focus across the page,MIT开源协议](https://github.com/kamranahmedse/driver.js)
+
+- [Intro.js is a lightweight JavaScript library for creating step-by-step and powerful customer onboarding tours商用授权](https://introjs.com/)
+    - [github](https://github.com/usablica/intro.js)
+- [Bootstrap Tour](https://bootstraptour.com/)
+    - [github](https://github.com/sorich87/bootstrap-tour)
+
+### 富文本编辑器
+
+- [企业版的开源富文本编辑器The rich text editor behind great content creation experiences](https://github.com/tinymce/)
+    - [TinyMCE](https://github.com/tinymce/tinymce)
+
+- [过时的YUI is a free, open source JavaScript and CSS library for building richly interactive web applications. ](https://clarle.github.io/yui3/)
+    - [github yui3 ](https://github.com/yui/yui3)
+
+- [The WYSIWYG Editor of tomorrow available today](https://ckeditor.com/)
+    - [CKEditor 5 is an ultra-modern JavaScript rich-text editor with MVC architecture, a custom data model, and virtual DOM](https://github.com/ckeditor/ckeditor5)
+
+- [Quill -- Your powerful rich text editor.](https://quilljs.com/)
+    - [github](https://github.com/quilljs/quill)
+
+### PDF
+
+- [PDF-LIB可写可修改](https://pdf-lib.js.org/) 字体必须内嵌，这样文件非常大，拷贝合并pdf时，内嵌字体还没法删除
+    - [github](https://github.com/Hopding/pdf-lib)
+
+- [jspdf只能写 github](https://github.com/parallax/jsPDF)
+
+### 数学
+- [regression-js是JS库，包含了linear least-squares filting methods对的数据分析方法，支持linear、exponential、logarithmic、power、polynomial几种常见的](https://github.com/Tom-Alexander/regression-js)
+
+- [ever polate -- Javascript Numerical Inerpolation library](https://github.com/BorisChumichev/everpolate)
+
+### 颜色库
+
+- [Modular, design-conscious color picker widget for JavaScript](https://iro.js.org/)
+    - [github](https://github.com/jaames/iro.js/)
+
+### 其他
+
+- [Create, read and edit .zip files with Javascript ](https://stuk.github.io/jszip/)
+    - [github](https://github.com/Stuk/jszip)
+```js
+jszip.loadAsync(new Blob([buffer])).then(zip=>{
+    zip.file('filename').async('ArrayBuffer').then(data=>{
+        console.log(data)
+    })
+})
+```
+
+#### 放大镜
+- [loupe.js 2.0 allows you to add photorealistic loupes (magnifier) to images on your webpages. The design is changeable by use of an image editing program. It uses unobtrusive javascript to keep your code clean. ](http://www.netzgesta.de/loupe/)
+
+##### loupe-js
+
+实现原理很简单, 就是图像因为窗口被压缩,放大镜的作用就是对原图采样截图图片,算好位置,可直接使用css来截图,不像loupe.js这个库使用的是两张图来截取.
+
+- [An image magnifier for JavaScript](https://github.com/nishanths/loupe-js)
+    - [demo](https://nishanths.github.io/loupe-js/?shape=rectangle)
+
+
+### UI
+- [bootstrap](https://getbootstrap.com/)
+    - [fast bootstrap](https://fastbootstrap.com/)
+
+- [naive ui](https://www.naiveui.com/en-US/os-theme)
+
+- [Element Plus](https://element-plus.org/en-US/component/button.html)
+
+- [ Fabric.js is a powerful and simple Javascript HTML5 canvas library ](http://fabricjs.com/)
+    - [github fabric](https://github.com/fabricjs/fabric.js)
+
+- [原生HTML5的canvas中所支持的贝塞尔曲线最多只到3阶,bezierMaker.js可以理论支持N阶贝塞尔曲线的生成](https://github.com/Aaaaaaaty/bezierMaker.js)
+
+- [AlloyImage - 基于HTML5技术的专业图像处理库](https://github.com/AlloyTeam/AlloyImage)
+
+- [JSCAD](https://jscad.app/)
+    - [github](https://github.com/jscad)    
+    - [open jscad](https://openjscad.xyz/)
+    - [CADit.app](https://cadit.app/)
+    - [A jscad UI playground developed here and meant to be later contributed into jscad](https://github.com/hrgdavor/jscadui)
+
+## Test
+
+**TDD**
+
+测试驱动开发， 在开发功能代码之前，先编写单元测试用例代码，确定需要编写的代码逻辑。TDD是XP(Extreme Programming)的核心实践
+
+**BDD**
+
+行为驱动开发， 
+
+“开发软件系统最困难的部分就是准确说明开发什么” (“The hardest single part of building a software system is deciding precisely what to build” — No Silver Bullet, Fred Brooks)
+
+BDD(Behavior Driven Development), 提出者 Dan North 强调 BDD 不是关于测试的，它是在应用程序存在之前，写出用例与期望，从而描述应用程序的行为，并且促使在项目中的人们彼此互相沟通
+
+测试相关的配置
+
+vue创建工程时，有一个[Manually select features](https://lmiller1990.github.io/vue-testing-handbook/zh-CN/setting-up-for-tdd.html#%E5%AE%89%E8%A3%85-vue-cli)中可配置
+- [BDD](https://insights.thoughtworks.cn/when-we-talk-about-bdd/)
+
+### [Jasmine](https://github.com/jasmine/jasmine)
+
+TDD(Test Driven Development)测试驱动开发的框架，
+
+[Behavior-Driven JavaScript docs](https://jasmine.github.io/pages/docs_home.html)
+[2.9](https://jasmine.github.io/2.9/introduction)
+
+### Jest 
+
+### Karma
+
+npm install --save-dev karma karma-mocha karma-chrome-launcher karma-mocha-reporter karma-webpack mocha mocha-sinon sinon sinon-chai webpack karma-chai chai
+
+运行
+node .\node_modules\karma\bin\karma start
+node .\node_modules\karma\bin\karma init 
+
+- [karma.conf.js配置](https://karma-runner.github.io/5.2/config/configuration-file.html)
+- [karma-coverage](https://github.com/karma-runner/karma-coverage)测试覆盖率
+
+### [chai](https://github.com/chaijs/chai)
+
+[document](https://www.chaijs.com/)

exercises/quadratic.equation.md

@@ -0,0 +1,103 @@
+# 二次方程
+
+## 一元二次不定方程
+
+在数学的历史中，不定方程指的是没有给出具体解法的方程，或者解的个数不是有限的，可能是无限多的解。
+
+而一元二次方程是指最高次项为二次的单变量（一个未知数）方程，形式通常为 
+
+$$
+ax^2+bx+c=0
+$$
+
+，其中 a、b、和c是已知数，而x是未知数。当这种方程的系数a、b、和c是变量而不是具体的数值时，我们称之为不定方程。
+
+
+### 例题1
+已知A、n为正整数，满足
+
+$$
+A = (n-7)(n+8)
+$$
+
+且A为完全平方数，那么n有最几个值，n的最小值是多少，n的最大值是多少？
+
+分析：因为n在变化，可以把A缩放在某个区间来解题。使用换元法替换一个变量，这样就更容易理解了。
+
+解：
+
+设k=n-7,则
+
+$$
+A = (n-7)(n+8) \to A = k(k+15) = k^2 + 15k < k^2 + 16k < k^2 + 16k + 4 = (k+8)^2
+$$
+
+$\because A=k^2 + 15k $
+
+是完全平方数，所
+
+$k^2+15$
+
+必然在两个完全平方数A和
+
+$(k+8)^2$
+
+之间。这样就可以一一判断两个等式之间是否成立了。
+
+$$
+k^2+15k=(k+1)^2 \to k=\frac{1}{13}
+$$
+
+$$
+k^2+15k=(k+2)^2 \to k=\frac{4}{11}
+$$
+
+$$
+k^2+15k=(k+3)^2 \to k=1 \to n=8 \to A=(8-7)(8+8)=1 \cdot 16=16=4^2
+$$
+
+$$
+k^2+15k=(k+4)^2 \to k=\frac{16}{7}
+$$
+
+$$
+k^2+15k=(k+5)^2 \to k=5 \to n=12 \to A=(12-7)(12+8)=5 \cdot 20=100=10^2
+$$
+
+$$
+k^2+15k=(k+6)^2 \to k=12 \to n=19 \to A=(19-7)(19+8)=12 \cdot 27 =2^2 \cdot 3 \cdot 3 \cdot 3^2=(2 \cdot 3 \cdot 3)^2 = 18^2
+$$
+
+$$
+k^2+15k=(k+7)^2 \to k=49 \to n=56 \to A=(56-7)(56+8)=49 \cdot 64 =7^2 \cdot 8^2=(7 \cdot 8)^2 = 56^2
+$$
+
+综上所述，n有4个值，最小的是8，最大的是56.
+
+### 例题2
+已知
+
+$$
+n^3 + 2n^2 + 8n - 5
+$$
+
+是一个正整数的立方，则正整数的n的值可能是
+
+解：
+
+$$
+n^3 < n^3 + 2n^2 + 8n - 5 < n^3 + 6n^2 + 12n + 8 = (n+2)^3
+$$
+
+可推出
+
+$$
+n^3 + 2n^2 + 8n - 5 = (n+1)^3 \to n^2 - 5n + 6 = 0
+$$
+
+
+$ \therefore 2^3 + 2 \cdot 2^2 + 8 \cdot 2 - 5 = 27 = 3^3 $
+
+$ \therefore 3^3 + 2 \cdot 3^2 + 8 \cdot 3 - 5 = 64 = 4^3 $
+
+因式分解可得n=2或3. 把结果待人方程也可以验证。

exercises/sequeezing.md

@@ -0,0 +1,4 @@
+# 夹逼法
+> "夹逼法" 在数学中是一种求解数值的方法，特别是在逼近理论中。在英文中，它通常被翻译为 "squeezing theorem" 或 "sandwich theorem"
+>> 这个术语描述的是一种技巧，通过证明一个未知的数值位于两个已知数值之间，并且这两个已知数值可以无限逼近未知数值，从而证明未知数值的特定属性或精确值。
+

index.html

@@ -5,9 +5,9 @@
     <meta charset="UTF-8" />
     <link rel="icon" href="./favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link rel="stylesheet" type="text/css" href="./bootstrap-5.0.2-dist/bootstrap.min.css">
+    <link rel="stylesheet" type="text/css" href="./libs/bootstrap-5.0.2-dist/bootstrap.min.css">
     <link rel="stylesheet" type="text/css" href="./index.css">
-    <script src="./bootstrap-5.0.2-dist/bootstrap.min.js"></script>
+    <script src="./libs/bootstrap-5.0.2-dist/bootstrap.min.js"></script>
     <link rel="stylesheet" type="text/css" href="./highlight/styles/default.min.css">
     <link rel="stylesheet" type="text/css" href="./highlight/styles/xcode.min.css">
     <link rel="stylesheet" type="text/css" href="./libs/marked/katex.min.css">
@@ -26,6 +26,7 @@
       <a href="./index/medicalScience.md">医学技术</a>
       <a href="./cg/blender/index.md">Blender</a>
       <a href="./html/index.html">网页</a>
+      <a href="./exercises/index.md">练习题</a>
     </section>
     <main class="main-content">
       <div id="content"></div>

libs/marked/mj-marked.mjs

@@ -21218,12 +21218,10 @@ function md2Html(md) {
         var str = el.textContent || '';
         if (((_a = str.match(regex)) === null || _a === void 0 ? void 0 : _a.length) == 2) {
             str = str.replace(regex, '');
-            console.log(1, el.textContent);
             katex.render(str, el, {
                 throwOnError: false,
                 leqno: true,
             });
-            console.log(2, el.textContent);
         }
     });
     return elDiv.innerHTML;