-
WebWorkers是浏览器的多线程API，可将耗时任务移至后台线程执行，避免阻塞主线程。通过创建独立JS文件并用newWorker()实例化，主程序与Worker间以postMessage通信，实现如斐波那契计算等密集任务，提升页面响应性。
-
@mixin本身不膨胀体积，滥用@include才导致CSS膨胀；因其是编译期文本替换，每次调用都原样复制整段样式，不合并、不去重，尤其在循环、嵌套或跨组件重复调用时生成大量冗余代码。
-
客户端表格排序通过减少请求、提升交互流畅性，满足用户对即时反馈的需求。利用data-type区分数据类型，结合parseFloat、Date对象和localeCompare确保准确排序，并通过CSS箭头与aria-sort属性实现视觉提示与可访问性，增强用户体验。
-
SSL证书有效性可通过四种方法验证：一、浏览器地址栏锁形图标查看证书有效期与颁发者；二、OpenSSL命令检测证书链、指纹及信任状态；三、在线平台扫描多客户端兼容性问题；四、curl命令联合验证TLS握手与HTTP响应。
-
Symbol定义常量更安全可靠，核心在于唯一性与避免碰撞：每次Symbol()生成全局唯一值，不参与遍历和序列化，支持Symbol.for()跨模块共享，且语义清晰、不可变。
-
子菜单容器必须显式设display:flex，不能依赖父级继承；因Flex作用域仅限直接子元素，.submenu作为.menu-item的子元素，需手动声明display:flex才能启用justify-content、flex-wrap等属性。
-
使用JavaScript预览图片可以通过FileReaderAPI实现。首先，监听文件输入框的change事件，读取文件并将其转换为数据URL，最后设置到img标签的src属性上。其次，需要注意以下几点：1.文件类型检查，确保是图片文件；2.文件大小限制，避免加载过大的文件；3.支持多文件预览；4.错误处理，提供友好的提示；5.图片格式检测和转换，确保所有浏览器兼容；6.性能优化，预览前压缩图片；7.添加加载动画，提升用户体验。
-
BroadcastChannelAPI是浏览器提供的同源跨标签页通信方案，通过创建命名频道实现消息广播；支持postMessage发送消息和onmessage或addEventListener接收消息，适用于登录状态同步、数据共享等场景；需注意仅同源通信、不保证消息顺序与送达、需手动关闭通道，且IE不支持、老版Safari有限兼容。
-
纯HTML+内联CSS可快速搭建轻量「关于我们」页：仅用语义化标签（header/main/footer）、系统字体、max-width:65ch排版、viewportmeta和防爬联系方式，文件精简至1KB内。
-
因为float使元素脱离文档流，父容器无法感知其高度而塌陷为0，导致背景消失、边框断裂、后续元素上移；清除浮动（如::after{clear:both}）只是补丁，而flex容器天然触发BFC，自动包裹子项、正确撑高。
-
lastIndexOf()是提取文件后缀最直接可靠的方式：先用lastIndexOf('.')获取最后一点索引，再通过substring(index+1)截取后缀，并需判断索引有效性及边界情况如无点、点在末尾或开头等。
-
max-width需配合width（如width:100%或width:fit-content）和display（如inline-block）才能避免塌陷或溢出；margin:0auto仅对有明确宽度的静态块级元素有效，Flex/绝对定位/行内元素需其他居中方式。
-
<var>是纯语义化标签，仅标注变量名，不存储值、不绑定JS变量；其内容需用textContent获取字符串，不能直接当作JS变量使用。
-
navigator.connection.effectiveType仅是浏览器基于历史数据估算的粗略网络类型，非实时网速指标；应以saveData为最高优先级，辅以downlink和rtt判断，结合防抖、兜底及手动开关实现可靠切换。
-
ChromeDevTools的Capturefullsizescreenshot是最可靠零依赖全页截图方案，基于Blink引擎真实渲染快照，完整支持阴影、滤镜、SVG、WebGL等效果，不拼接不模拟；而html2canvas等库仅靠CSS解析重绘，对字体、跨域图、伪元素、Flex/Grid等支持极弱，仅适用于简单静态模块。
