animation和transition可在同一元素共存：animation用于自动循环的关键帧动画，如浮动；transition用于响应用户交互的属性过渡，如hover缩放。二者分工明确，避免同时修改同一属性以防止冲突，合理搭配可提升交互丰富性与流畅度。

可在网页中通过JSZip、zip.js等JavaScript库结合FileAPI实现ZIP压缩包的浏览器端解压与预览，支持文本/图片预览、单文件下载、大文件流式处理、WebAssembly加速及安全路径校验。

HTML元素高度需通过子元素或CSS控制；height:100%生效前提为父容器有明确高度；推荐用min-height:100vh确保占满视口；Flex布局中子元素需align-items:stretch或flex:1才能拉伸；表格单元格高度需table-layout:fixed配合设置。

Babel是将新版本JavaScript（如ES2015+）转为向后兼容代码（如ES5）的编译器，解决浏览器对新特性支持不一的问题；它支持箭头函数、解构赋值、类、模块、async/await等语法转换，并可通过插件实现polyfill注入、JSX/TS支持及智能目标环境适配。

需为iPhoneX及更新全面屏iOS设备适配底部按钮，通过在fixed定位的footer上设置padding-bottom:env(safe-area-inset-bottom,0px)并添加viewport-fit=cover的viewport声明，确保按钮避开HomeIndicator且保持贴底效果。

HTML优化的核心是减小文件体积、提升解析渲染效率，具体包括：1.压缩HTML，去除注释、空格和换行；2.将CSS和JavaScript外链并压缩，以利于缓存和减少HTML臃肿；3.优化图片，选用WebP格式、压缩大小并使用懒加载；4.使用语义化标签，简化DOM结构以降低渲染开销；5.启用服务器端Gzip压缩，减少传输体积；6.内联关键CSS以提升首屏渲染速度；7.利用VSCodeLiveServer、Pythonhttp.server或Node.jsserve搭建本地服务器实现高效预览调试；8.熟练使用

JavaScript性能优化的核心是减少计算、避免阻塞、善用浏览器机制：缓存DOM访问、禁用生产环境console/debugger、合理管理闭包与事件监听、用Set替代数组查找、优化字符串操作。

冒泡排序通过相邻元素比较交换实现O(n²)排序；2.快速排序采用分治法以O(nlogn)平均复杂度高效排序；3.二分搜索在有序数组中以O(logn)时间查找目标值。

默认width不包含padding，即content-box模型下width仅指内容区宽度；启用border-box后width包含padding和border，现代项目常全局重置为border-box以避免溢出问题。

可通过浏览器直接打开HTML文件预览，或在VisualStudio中配置外部浏览器、使用IISExpress本地服务器、安装LiveServer扩展实现一键运行和实时刷新，满足静态展示与动态调试需求。

ES模块（ESM）是浏览器和现代Node.js原生支持的静态模块系统，与动态的CommonJS不兼容；需用import/export顶层声明，支持命名/默认/混合导出及动态导入，路径须为字面量且带扩展名或相对前缀。

requestAnimationFrame是浏览器原生动画API，按屏幕刷新率执行且自动暂停；与setTimeout不同，它需递归调用、基于时间戳计算位移、及时cancel以避免泄漏。

JavaScript实现动画的核心是通过requestAnimationFrame与浏览器刷新同步，持续更新元素的transform或opacity等高性能CSS属性，避免回流和重绘，结合缓动函数提升视觉流畅度，同时可借助GSAP等动画库简化复杂动画的开发，实现高效、流畅的动画效果。

JavaScript模板引擎核心是解析、编译、渲染三步，基础用with+newFunction，进阶用词法分析+AST，需沙箱隔离与安全语法设计。

HTML5推荐用footer元素语义化添加版权信息，支持©实体、动态年份及CSS底部定位；非footer场景可用role="contentinfo"保持可访问性。