-
答案：前端存储方案需根据数据大小、持久化需求及性能选择。Cookie适合小量敏感信息，因自动携带影响性能；LocalStorage提供5~10MB持久化存储，适用于缓存配置等非频繁更新数据；IndexedDB为异步数据库，支持大量结构化数据操作，适合离线应用与复杂数据逻辑。
-
animation结合opacity与translate可实现流畅的淡入滑入效果，如模态框、提示信息等；opacity控制透明度，translate实现无重排位移，两者均由GPU加速，性能优异；通过transition或@keyframes定义动画，配合forwards保持终态，建议避免使用left/top等触发重排的属性，可用will-change提升渲染效率，适用于页面提示、侧边栏展开等场景。
-
使用CSSFlexbox排列按钮组可通过设置display:flex、gap和justify-content实现均匀间距，结合flex-wrap与媒体查询支持响应式换行，利用align-items保证垂直对齐，并通过visibility:hidden处理禁用状态以维持布局稳定。
-
生成器与传统数据结构的根本差异在于其惰性求值和按需生成的机制，1.列表等传统结构会一次性将所有数据加载到内存，而生成器通过yield关键字实现函数执行的暂停与恢复，仅在需要时生成值；2.这使得生成器内存占用极低，适合处理海量数据或无限序列；3.生成器是一次性的，无法重复遍历，这是为内存效率做出的权衡；4.在实际应用中，生成器可用于逐行读取大文件、批量加载机器学习数据以及生成无限序列等场景；5.在Python中可通过定义含yield的函数或使用生成器表达式（用()包裹的推导式）来创建生成器，二者均利用惰性求
-
弹窗布局核心是定位、层叠与居中。通过fixed定位实现脱离文档流，配合z-index控制层级，使用transform或flexbox实现居中，结合遮罩层阻止交互并防止滚动，利用max-width和媒体查询适配响应式，确保弹窗在不同设备稳定显示且用户体验良好。
-
通过WebAuthn实现生物识别无密码登录，核心是公钥加密技术。1.注册时调用navigator.credentials.create()生成密钥对，私钥存于设备安全模块，公钥发至服务器；2.登录时通过navigator.credentials.get()获取凭证，用户经指纹或面容验证后，认证器用私钥签名挑战码并返回断言；3.服务器验证签名与挑战码一致性完成身份确认。全程私钥不离设备，依赖HTTPS、随机挑战码、RPID校验和超时机制保障安全。现代浏览器均支持，需前后端协同实现完整流程。
-
答案：前端项目需通过JavaScript错误监控与上报机制及时发现并定位线上问题。1.使用window.onerror捕获全局同步错误，但无法获取Promise错误和跨域脚本详细信息；2.通过addEventListener('unhandledrejection')监听未捕获的Promise异常；3.实现reportError函数，优先使用navigator.sendBeacon上报错误数据以确保页面卸载时仍能发送；4.结合SourceMap解析压缩代码的堆栈信息，还原真实源码位置以便调试。该体系需兼顾
-
答案：设计轻量级JavaScript游戏框架，包含游戏循环、渲染系统、实体管理、输入处理、资源加载和碰撞检测六大模块。通过requestAnimationFrame实现稳定游戏循环，结合deltaTime确保帧率独立；采用组件化实体系统提升复用性；封装输入管理器统一处理用户交互；资源加载器利用Promise.all保障资源就绪；提供AABB碰撞基础并预留扩展接口。结构清晰、模块解耦，便于快速开发与迭代。
-
HTML中添加水印可通过CSS背景或JavaScript实现，前者简单高效适用于静态水印，后者灵活且具一定防篡改能力，但复杂度较高。
-
掌握浮动与清除浮动机制，使用clearfix解决高度塌陷，合理应用clear属性控制布局流，并逐步用Flexbox或Grid替代，提升页面稳定性与可维护性。
-
CSS中颜色默认值由浏览器和元素继承决定，textcolor通常为黑色或深灰，background-color默认透明，具体可通过开发者工具查看，建议使用CSSReset统一样式。
-
答案：WebSocket通过持久化双向通信实现多端实时同步，相比轮询更高效。前端用原生API建立连接，服务端可选Node.js、Java等技术实现。需定义消息类型、唯一ID、用户标识和房间机制，客户端发送变更请求，服务端验证后广播更新，各端同步响应。并发冲突可用OT、CRDT或加锁解决。为保障稳定，客户端应自动重连，服务端暂存消息，支持离线补同步，并可降级使用长轮询。关键在于服务端精准识别用户与数据关系，可靠分发消息并处理异常，确保毫秒级响应。
-
要实现JavaScript流程图，首选使用第三方库而非自行开发，核心方法有两种：一是通过DOM、SVG或Canvas手动绘制，其中DOM适合简单场景但性能差，SVG因矢量特性、良好交互支持和清晰结构更适用于中等复杂度流程图；二是采用成熟库如mxGraph或GoJS等提升效率与稳定性。
-
构建工具通过配置自动处理CSS。1.Webpack解析import语句，用css-loader和style-loader将样式注入DOM；2.打包流程含解析、转换、压缩及提取独立文件；3.生产环境用MiniCssExtractPlugin输出带哈希的CSS文件；4.Vite开发时直接插入样式，构建时用Rollup输出CSS，支持模块化与预处理器，配置更简洁。
-
浮动布局通过float实现多栏排列，需清除浮动；定位布局利用position控制元素位置，适合特殊场景；Flex布局适用于一维排列，支持弹性伸缩；Grid布局为二维系统，可定义行列结构；圣杯与双飞翼布局实现三栏自适应；响应式布局结合媒体查询与弹性单位适配多端设备。
