liang14658fox性能优化
平时都用了哪些方法进行性能优化？
减少http请求次数、打包压缩上线代码、使用懒加载、使用雪碧图、动态渲染组件、CDN加载包。
图片懒加载是怎么实现的？
其他优化
- 首屏优化
- webpack
- 打包优化
- 网络
- dom操作
- 合成层
- Seo引擎优化
- JS优化 隐藏类Hidden Class
优化入手方向
- 减少前端资源数量，减小前端资源大小，减少dom操作
- 代码层面：注意事件的销毁、路由懒加载、提取公共代码、css放前面、组件懒加载、减少代码体积大小、字体图标代替图片、使用事件委托、使用查找表、不覆盖原生方法、减低css选择器复杂度、使用flex、使用 transform 和 opacity实现动画
- 交互优化：减少请求数量、使用 HTTP2（头部压缩、链路复用、解析快、可设置优先级、流量控制、服务器推送）、减少重绘重排（innerHTML代替DOM操作、避免使用动态属性、脱离文档流操作再合并）
- 加载优化：按需引入、使用CDN、使用服务端渲染、善用缓存、避免卡顿
- 打包优化：使用gzip、Webpack 对图片进行压缩、webpack 按需加载代码、提取第三库代码、webpack物理打包以及配置项打包优化
- 其他优化：图片优化（压缩、懒加载、用webp格式，延迟加载、响应式图片）、使用工作线程Web Workers、少用全局变量
低代码
服务端渲染SSR
服务端渲染 SSR与客户端渲染CSR(同构渲染)
SSR：在服务器端渲染 HTML 给客户端，提升首屏性能 + SEO；
CSR：客户端渲染，交互丰富。同构渲染指服务端和客户端共享代码、渲染逻辑。在使用 Next.js／Nuxt.js 时会经常接触这个概念。
国际化
跨端开发
小程序开发
微信登录接口
移动端开发
前端安全
前端微服务
qiankun:一个用于构建 微前端（Micro-Frontends）系统的解决方案，支持隔离样式、JS 沙箱、子应用预加载等。
设计模式
在前端工程化中常提及（如模块化、组件化、依赖注入、观察者模式、策略模式等）。
微前端
架构思想：将前端大应用拆分为多个可独立部署／独立团队维护的子应用。与微服务理念类似，在前端层面应用。
GIS开发
大数据GIS
服务端GIS
桌面GIS
ArcGIS
GeoServer
SuperMap
Quasar
SEO优化
在 Web 应用中优化搜索引擎可见性（如首屏渲染、语义化标签、性能优化、结构化数据等）。对于 SSR／静态生成的框架尤为重要。
Web服务器
WebGL
数字孪生低代码3D框架-UINO优诺ThingJS
three.js
其他
| 名称 | 性质 | 简要介绍 | 主要作用 |
|---|---|---|---|
| dhtmlx-Gantt（甘特图） | 技术（库） | JavaScript 甘特图组件，用于任务进度和依赖可视化 | 实现项目进度管理、任务排期展示 |
| Hooks | 概念/技术 | React 中的函数式状态逻辑机制（如 useState、useEffect） | 在函数组件中使用状态与生命周期 |
| session | 概念 | 服务端存储用户会话信息的机制 | 维持用户登录状态、跨请求身份识别 |
| Socket 通信 | 技术 | 服务器与客户端间的双向实时通信机制 | 实现消息推送、聊天室、协作等实时功能 |
| Store | 概念 | 前端应用中的全局状态仓库（如 Vuex、Redux） | 统一管理和共享组件间的状态数据 |
| Mongoose | 技术（库） | Node.js 的 MongoDB 对象建模工具（ODM） | 方便定义数据模型、验证与数据库交互 |
| WebSocket | 技术（协议） | 浏览器与服务器之间的全双工通信协议 | 实现实时更新、推送通知等功能 |
| XSS / CSRF | 概念 | 常见前端安全漏洞：跨站脚本攻击 / 请求伪造 | 防止代码注入与恶意请求 |
| 持久化存储 | 概念 | 数据长期保存在本地，如 localStorage、IndexedDB | 保持用户数据、实现离线应用 |
| TypeORM | 技术（框架） | 基于 TypeScript 的 ORM 框架，支持多种数据库 | 对象化数据库操作，提高开发效率 |
| 同构渲染 | 概念 | 前后端共用同一份渲染逻辑（SSR+CSR） | 提升首屏加载速度与 SEO 效果 |
| CI/CD + Docker 自动化部署 | 技术（工程实践） | 结合 CI/CD 管线与 Docker 容器实现持续集成与部署 | 自动构建、测试、部署项目 |
| Cache-Control | 技术（HTTP 头） | HTTP 缓存控制字段（如 max-age、no-cache） | 控制浏览器和中间代理缓存策略 |
| 强缓存 | 概念 | 浏览器在缓存未过期前直接使用本地资源 | 加快资源加载，减少请求数 |
| 中间服务 | 概念/架构 | 位于前后端之间的代理或聚合层 | 做鉴权、缓存、限流、数据聚合等 |
| Expires | 技术（HTTP 头） | 指定资源缓存的绝对过期时间 | 早期缓存控制机制（已被 Cache-Control 替代） |
| Cache API | 技术（Web API） | Service Worker 中的缓存接口 | 实现离线缓存、自定义资源更新策略 |
| Service Worker | 技术（浏览器机制） | 浏览器后台脚本，可拦截请求、缓存内容 | 支持离线访问、PWA、消息推送 |
| 静态资源 | 概念 | 网站中不会频繁变动的文件（JS、CSS、图片） | 提高加载性能、配合 CDN 加速 |
| CDN 边缘节点 | 技术 | CDN 网络中的就近缓存服务器 | 提供资源的本地加速访问 |
| CDN 网络 | 技术/架构 | 内容分发网络，通过节点分发资源 | 减少延迟，提高全球访问速度 |
| 分层缓存 | 概念 | 浏览器、CDN、代理、服务端多级缓存策略 | 提升整体系统性能与响应速度 |
| hash | 技术（构建机制） | 根据文件内容或时间生成的指纹值 | 控制版本与缓存失效 |
| contenthash | 技术（构建机制） | 根据文件内容生成稳定哈希 | 仅内容变更时更新哈希，避免缓存浪费 |
| 协商缓存 | 概念 | 资源变更由服务器校验（ETag/Last-Modified） | 节省带宽，保持最新资源 |
| CI/CD 集成 | 技术/概念 | 持续集成与持续交付自动化流程 | 自动化构建、测试、部署，提高效率 |
| oops joe | 概念（假设为 OOPs，面向对象编程） | OOPs 为面向对象设计理念（封装、继承、多态） | 提高代码复用与可维护性 |
| Adobe Illustrator | 工具 | 专业矢量图形设计软件 | 绘制 UI、图标、矢量插画 |
| Tailwind CSS | 技术（框架） | 原子化 CSS 框架，使用类名快速构建样式 | 高效开发、统一设计系统 |
| Redux | 技术（库） | JavaScript 状态管理工具，基于单向数据流 | 管理复杂应用的全局状态 |
前端自动化性能测试 网站部署方案 CSS BEM命名法 模块化分离组件代码 watchEffect中的异步问题 封装resize指令 Intersection Ovserver 浏览器指纹 静态资源的静态访问 拖拽API PostCSS