前端技术关键词
大约 5 分钟
前端技术关键词
基础语言和标准
- HTML
- CSS
- JavaScript
- TypeScript
- ES6+
- DOM
- JSON
- XML
前端框架和库
- React
- Vue
- Angular
- Svelte
- jQuery
- UniApp
- Flutter
- Redux
- MobX
- Vuex
- Recoil
- Context API
- Next.js
- Nuxt.js
样式和 UI 库
- SASS
- LESS
- PostCSS
- Tailwind CSS
- Bootstrap
- Material UI
- Chakra UI
- Styled Components
- Emotion
- Ant Design
构建工具和模块打包
- Webpack
- Vite
- Babel
- Rollup
- Parcel
- SWC
- TurboPack
包管理工具
- npm
- Yarn
- Pnpm
API 和数据处理
- AJAX
- Fetch API
- Axios
- REST API
- GraphQL
- JSON Web Token (JWT)
- OAuth
渲染和视图技术
- Web Components
- Lit
- Three.js
- WebGL
- Canvas API
- SVG
- D3.js
- Chart.js
- Virtual DOM
- Shadow DOM
性能优化和加载策略
- SSR (Server-Side Rendering)
- CSR (Client-Side Rendering)
- SSG (Static Site Generation)
- HTTP/2
- Webpack Dev Server
- Hot Module Replacement (HMR)
- Tree Shaking
- Code Splitting
- Progressive Enhancement
本地存储
- LocalStorage
- SessionStorage
- IndexedDB
前端安全和认证
- JSON Web Token (JWT)
- OAuth
PWA 和离线应用
- PWA (Progressive Web App)
- Service Worker
网络和实时通信
- WebSocket
- Socket.io
数据库和后端即服务
- Firebase
- Supabase
测试工具和框架
- Testing Library
- Jest
- Mocha
- Chai
- Cypress
- Playwright
- Storybook
- Vitest
- E2E Testing
- Component Testing
可访问性、国际化和本地化
- Accessibility (a11y)
- SEO
- i18n (Internationalization)
- l10n (Localization)
开发工具和项目管理
- Git
- Docker
- CI/CD
- Linting
- Prettier
- ESLint
- Monorepo
其他
- Responsive Design
- Flexbox
- CSS Grid
- Media Queries
- Cross-Browser Compatibility
- Polyfill
- Micro Frontends
- WebAssembly
实时数据同步和协同编辑库
- Yjs：用于构建高效的协同编辑应用，支持多种传输协议
- Automerge：处理离线优先和冲突解决的 CRDT (Conflict-free Replicated Data Type) 库
- ShareDB：基于 Operational Transformation (OT) 的实时协作引擎
- CodeMirror Collab：适用于 CodeMirror 编辑器的协作功能扩展
- Slate-yjs：用于结合 Yjs 和 Slate.js 构建协同编辑的解决方案
- ProseMirror-collab：ProseMirror 文本编辑器的协同编辑插件
WebSocket 和实时数据传输
- WebSocket：双向通信协议，实现实时数据传输
- Socket.io：基于 WebSocket 的实时通信库，提供事件驱动的编程接口
- SignalR：Microsoft 提供的实时通信库，适用于 Web 和桌面应用
- Firebase Realtime Database：Google 提供的实时数据同步服务
- Firestore：Firebase 的云数据库，支持实时数据监听
数据结构和算法
- CRDT (Conflict-free Replicated Data Type)：解决协同编辑中数据同步和冲突的问题
- Operational Transformation (OT)：一种在协同编辑中处理编辑冲突的算法
协同白板和绘图工具
- Excalidraw：开源协同白板工具，适用于多人实时绘图
- Figma API：Figma 提供的 API，用于创建类似实时设计协作的功能
- tldraw：支持实时协同编辑的开源绘图库
后端和数据库支持
- Redis Pub/Sub：用于发布/订阅模式的实时消息传递，支持简单的协同编辑
- CouchDB：文档数据库，支持多主复制，适合离线同步
- PostgreSQL with Listen/Notify：通过数据库的通知机制实现基本的实时数据更新
- AWS AppSync：AWS 提供的 GraphQL 实时数据服务，可用于协同编辑
其他相关技术
- WebRTC：适用于低延迟、点对点的数据传输，特别适合视频、音频和文件共享协作
- Presence：显示用户实时在线状态或正在操作的位置（如在 Google Docs 中的光标）
- Diff Match Patch：Google 提供的文本差异和合并工具，用于文本比较和协同编辑的变更合并
渲染引擎
- amis：百度开源的低代码框架，可以将 JSON 配置转化为可视化 UI
- Alipay Rax：适用于多端的渲染引擎，支持小程序、Web 和客户端
- CPage：京东开源的低代码框架，提供页面的动态渲染能力
- Formily：阿里开源的表单渲染框架，专注于表单构建
拖拽和动态布局
- React DnD、React-beautiful-dnd：用于实现拖拽功能，帮助用户可视化布局页面
- Golden Layout、GridStack.js：实现动态网格布局，允许用户调整组件在页面中的布局
- Konva.js：用于可视化编辑和渲染的 HTML5 2D 画布库，支持更复杂的拖放和节点渲染
动态代码生成
- AST (抽象语法树)：生成和解析代码，用于将低代码平台的配置转换为代码
- Babel：JavaScript 编译器，用于动态生成或转换代码
- Esprima、Acorn：用于解析 JavaScript 代码，将配置文件转化为代码或代码生成器
表单构建和数据绑定
- Formik、React Hook Form：用于表单数据管理和状态同步，适合低代码平台中的表单构建
- RxJS：实现响应式的数据流管理，适用于动态表单和数据同步
配置驱动和数据结构
- JSON Schema：用于定义和验证数据结构，使得平台可以根据 JSON 配置渲染 UI
- GraphQL：用于实时数据查询和动态数据绑定，适合在低代码应用中实现数据驱动渲染
- Zod、Yup：用于数据验证和模式定义，确保用户输入和表单数据符合预期结构
后端支持和无代码集成
- Firebase、Supabase：提供后端即服务支持，使得低代码平台可以轻松集成数据库和认证
- Strapi、Contentful：Headless CMS，便于将内容管理集成到低代码平台中，实现无代码的内容更新
- Directus：开源数据平台，提供无代码管理界面，并支持动态 API 查询
工作流和自动化
- n8n、Zapier、Integromat：自动化工具和工作流引擎，可以在低代码平台中实现业务逻辑自动化
- Node-RED：流式编程工具，用于低代码平台中实现 API 集成和数据流处理
渲染优化和性能
- Code Splitting：用于按需加载代码，避免低代码平台中生成的大型应用影响加载速度
- Lazy Loading：支持组件的延迟加载，使页面可以在组件渲染之前就呈现
- Virtual DOM：确保组件状态变更不会影响整体性能，适用于 React 和 Vue 平台