杂项

141 阅读3分钟

杂项

计算机语言

计算机不能理解高级语言,只能理解机器语言,所以需要把高级语言转为机器语言,才能只执行高级语言编写的程序。根据执行语言的流程,把语言分为编译型语言和解释型语言。

编译型语言:
  • 程序在执行之前,把程序编译成为机器语言的文件,运行时不需要重新翻译,可以直接使用。程序执行效率高,依赖编译器,跨平台性差些。如C、++、90等
解释型语言:
  • 程序在运行时才翻译成机器语言,每执行一次都要翻译一次。程序执行效率低,依赖解释器,跨平台性好。
编译器执行过程:
  • 源代码--> 语言分析--> AST--> 语义分析--> 中间代码--> 代码优化--> 二进制文件--> 直接执行--> 执行
解释器执行过程:
  • 源代码--> 语言分析--> AST--> 语义分析--> 字节码--> 解释执行--> 执行
JS执行过程:
  • JavaScropt--> 词法分析--> 词法单元(Token)--> 语法分析--> 抽象语法树(AST)--> 解释--> 字节码--> 优化字节码--> 机器码--> 执行

基础算法

  1. 算法的复杂度分析。
  2. 排序算法,以及他们的区别和优化。
  3. 数组中的双指针、滑动窗口思想。
  4. 利用 Map 和 Set 处理查找表问题。
  5. 链表的各种问题。
  6. 利用递归和迭代法解决二叉树问题。
  7. 栈、队列、DFS、BFS。
  8. 回溯法、贪心算法、动态规划。

react原理

  1. 虚拟dom
  2. fiber架构
  3. 工作单元fiber初始化
  4. 遍历子节点和兄弟节点
  5. 构建子节点fiber树
  6. diff算法实现
  7. 渲染成真实dom
  8. 浏览器空闲
  9. 消息通讯
  10. 模拟React调度器
  11. 面试篇总

vue原理

  1. vue-模板编译(mustache模板引擎)
  2. vue-AST抽象语法树
  3. vue-数据响应式原理
  4. vue-虚拟dom和diff算法
  5. vue-指令和生命周期
  6. new Vue初始化过程
  7. vue-computed原理
  8. vue-nextTick原理

Figma 的 MCP

Figma 的 MCP 是指 Multiplayer Collaboration Platform(多人协作平台) ,这是 Figma 背后核心技术的核心名称之一。它使得多个设计师可以实时协作编辑同一个设计文件,就像 Google Docs 那样。

Figma 实现以下功能的技术基础:

  1. 多人同时在线编辑
  2. 实时同步更新
  3. 在线评论与反馈
  4. 历史版本追踪
  5. 用户光标和状态显示(谁在做什么)

MCP 的核心能力

功能描述
✅ 实时协同编辑多个用户可同时在一个设计文件中工作,彼此的操作会即时同步
✅ 光标与状态显示可以看到其他用户的鼠标位置、正在选择的元素、当前操作等
✅ 文档历史版本所有变更都会被记录,支持回退到任意时间点
✅ 网络断开自动重连即使网络中断,也能自动重新连接并同步更改
✅ 权限管理支持不同权限等级:查看、评论、编辑、管理员

技术原理简析(基于公开资料)

1. Operational Transformation (OT) 或 Conflict-Free Replicated Data Types (CRDTs)

用于处理多用户并发编辑时的数据一致性问题。

  1. OT 是 Google Docs 使用的经典算法。
  2. CRDTs 是一种更现代的方式,适合分布式场景。Figma 很可能使用的是自研的、类似 CRDT 的数据结构来高效处理文档变更。
2. WebSockets + 自定义协议

Figma 客户端通过 WebSocket 与服务器保持长连接,用于:

  1. 同步文档状态
  2. 推送用户行为(如选中元素、输入文字)
  3. 传输二进制资源(如图片)
3. 客户端-服务端架构
  1. 每个用户运行一个浏览器端的设计“客户端”
  2. 所有变更先提交给 Figma 的服务器进行合并和广播
  3. 服务器负责协调所有用户的操作,避免冲突

TS解释文件

vite-env.d.ts

/// <reference types="vite/client" /> // TS引入文件时声明