记一次 iOS 环境 H5 页面突然白屏
在新版本 iOS 系统中，某页面出现白屏，原因是 Safari 浏览器新增的全局变量 browser 与旧项目中的同名变量冲突。通过临时修复和代码重构解决了此问题，并加强代码审查和监控机制，以防止类似情况再次发生。
标签： H5
通过 eslint stylelint htmllint 规范前端项目代码
概述了如何使用 husky、lint-staged、prettier、eslint、stylelint 和 htmllint 等工具规范 JavaScript、CSS 和 HTML 代码，提供详细的配置示例，涵盖代码格式、语法规则以及最佳实践，帮助开发者构建一致且高质量的代码风格。
使用 postMessage + iframe 实现跨域通信
介绍了 window.postMessage() 方法的用途及语法，阐明其在跨源通信中的安全性和灵活性。通过示例展示了消息发送和接收的实现，强调 targetOrigin 的重要性以及验证 event.origin 以确保敏感信息的安全传输。
基于 Vue.js 的前端开发规范
提供了 Vue 组件命名、Prop 定义、指令使用及样式规范，强调 v-for 和 v-if 的高效用法。JavaScript 部分建议使用 let/const、箭头函数、模块化及 Map 等优化代码。HTML/CSS 强调语义化命名、简化选择器、属性缩写及避免使用 table 布局，统一采用 HTML5 标准，注重代码可读性与性能优化。
H5 应用程序缓存 - Cache manifest
介绍了 manifest 的离线缓存功能及其优化加载速度的作用，适用于离线场景的应用如 H5、静态页面等。分析了其更新滞后、全量加载等问题，并指出其逐步被废弃的趋势。通过示例展示配置方法，强调 manifest 更适合离线工具类应用，不适用于频繁更新的网站。
H5 localStorage入门
讲解了 localStorage 的定义、属性及常用方法，包括 setItem、getItem、removeItem 和 clear 的使用方式。介绍了如何存储和读取复杂数据类型，并通过监听 storage 事件实现浏览器标签间通信。强调 localStorage 的使用限制，如同域名限制、低版本浏览器兼容性及移动端潜在问题，并提供跨域通信的解决方案。
HTML5 全屏浏览器兼容方案
介绍了 HTML5 全屏 API 的使用方法，包括 requestFullscreen() 和 exitFullscreen() 的调用方式及注意事项，提供了浏览器兼容性处理方案，并通过代码示例演示了全屏请求与退出的实现，适配主流浏览器的不同方法。