05 2025 档案
摘要：It can be a performance bottleneck if you frequently add/remove event listener bind to a DOM element. patchProps(el, key, prevValue, nextValue) { if (
阅读全文
摘要：Brwoser support: https://caniuse.com/?search=%3Ahas <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="widt
阅读全文
摘要：Browser support: https://caniuse.com/?search=clamp <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="wid
阅读全文
摘要：Browser support: https://caniuse.com/css-text-wrap-balance <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" cont
阅读全文
摘要：可扩展性是指系统、程序或技术架构在功能、规模及性能需求增加时，能够容易地增加其性能、容量和功能的能力。 示例 假设我们有一个国际化网站，我们希望根据用户选择的语言动态显示不同的内容，比如在网站首页展示一个欢迎语，不考虑扩展性，可能的实现方式如下： <!--Vue实现示例--> <template>
阅读全文
摘要：Browser support: https://caniuse.com/css-container-queries <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" cont
阅读全文
摘要：Browser support: https://caniuse.com/?search=Dynamic%20viewport%20units Dynamic viewport mainly resolve the issue of mobile web, due to mobile has flo
阅读全文
摘要：Browser support: https://caniuse.com/?search=aspect-ratio <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" conte
阅读全文
摘要：Brwoser support: https://caniuse.com/?search=Logical%20Properties%20 We want to achieve following effect, the first box, we applied writing-mode: vert
阅读全文
摘要：Browser support: https://caniuse.com/?search=writing <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="w
阅读全文
摘要：Brwoser support: https://caniuse.com/?search=width%3Amin-content https://caniuse.com/?search=width%3Amax-content <!DOCTYPE html> <html lang="en"> <hea
阅读全文
摘要：Browser support: https://caniuse.com/?search=subgrid <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="w
阅读全文
摘要：Browser support: https://caniuse.com/?search=scrollbar-gutter When a element has limited size, and the content is oversized, the scrolling bar will sh
阅读全文
摘要：Browser support: https://caniuse.com/?search=%40media Normally we write midea query like this: @media (max-width: 750px) { div { color: red; } } It ap
阅读全文
摘要：Browser support: https://caniuse.com/?search=layer As we know by defualt, class selector has a higher priority than element selector in CSS <!DOCTYPE
阅读全文
摘要：因为有一些属性，在HTML标签上的名字和DOM Properties API中的名字是不一致的，比如最常用的，标签上的class属性，DOM Properties中是className 另外，并不是所有 HTML Attributes 都有与之对应的 DOM Properties，例如： <div
阅读全文
摘要：竞态问题通常在多线程编程中被提及。 多线程中的竞态问题（Race Condition）是指多个线程或进程在并发执行时，由于对共享资源（如变量、内存、文件等）的访问和修改顺序不确定，导致程序行为不可预测的问题。 竞态问题的关键点在于： 共享资源：多个线程同时访问并修改同一个资源，如全局变量或内存位置。
阅读全文
摘要：Browser support: https://caniuse.com/?search=animation-timeline <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport"
阅读全文
摘要：Browser support: https://caniuse.com/?search=%40property Normal CSS variable doesn't support gradient animation <!DOCTYPE html> <html lang="en"> <head
阅读全文
摘要：Browser support: https://caniuse.com/?search=anchor%20positioning <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewpor
阅读全文
摘要：Browser support: https://caniuse.com/?search=%40scope Example 1: global @scope () <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <me
阅读全文
摘要：Browser support: https://caniuse.com/?search=css%20nesting Example 1: <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="
阅读全文
摘要：// 内置工具类型 // 1. Partial<T>：将类型 T 的所有属性变为可选属性。 // 2. Required<T>：将类型 T 的所有可选属性变为必需属性。 // 3. Readonly<T>：将类型 T 的所有属性变为只读属性。 // 4. Record<K, T>：将类型 K 的所有
阅读全文
摘要：开发中的那些规范 为什么需要规范 现在开发一个应用基本上都是多人协作，一旦涉及到多人，必然不同的开发者的开发习惯、编码方式都是有所不同的，如果没有一个统一的规范，就会造成非常多的问题： 代码风格不一 目录杂乱无章 接口不统一（偏后端），例如： 修改用户定的接口为 /v1/users 修改密钥的接口：
阅读全文
摘要：Sometime the element width is dynmiac, and you want to use the width in css, how to do that 1. Define css variable in css file, --wis the container's
阅读全文
摘要：By default, git ignorecase for filename. It might happen that you change the filename from Modal.vueto modal.vue, then commit to git, in remote repo,
阅读全文
摘要：type Watcher<T> = { on<K extends keyof T & string>( eventName: `${K}Changed`, callback: (oldValue: T[K], newValue: T[K]) => void ): void; }; declare f
阅读全文
浙公网安备 33010602011771号