本文探讨了人工智能时代前端开发者的机遇。分析了从命令行到图形界面再到自然语言交互（GUI+LanguageUI）的演变趋势。介绍了 GPT 模型的能力与局限，列举了 Microsoft Copilot、GitHub Copilot 等集成案例。建议前端工程师掌握 LLM 工程化技术，利用 LangChain 和向量数据库构建应用，关注业务痛点，通过优化交互体验在 AI 浪潮中建立竞争优势。
自从 2022 年底 OpenAI 推出了 ChatGPT3.5 后，GPT 的活跃用户数快速突破一亿，打破了互联网应用发展的历史记录。ChatGPT 是一种基于人工智能技术的聊天机器人，它可以理解人类的自然语言，模拟人类的语言和思维方式，与人类进行自然的对话。GPT 技术的发展，给社会带来了巨大的影响，各行各业都在讨论 GPT 影响和带来的机会。
微软公司创始人比尔·盖茨在其博客文章《人工智能时代已经开启》中表示，自 1980 年首次看到图形用户界面（graphical user interface）以来，OpenAI 的 GPT 人工智能模型是他所见过的最具革命性的技术进步。
前端工程师本质上是开发软件 GUI（graphical user interface）部分，GPT 技术发展使得应用从 GUI 慢慢往 GUI&LanguageUI 结合方向发展，对于软件工程在视图层的架构要求更高，帮助产品更加好用和业务上能取到更大的业务价值。在这个充满变化和机会的时代，我们前端开发者如何抓住机会呢？本文从认识 GPT、GPT 集成软件调研和机会等方面分享下自己的看法。
GPT 是目前自然语言处理领域最先进、最强大的机器学习模型，它能够理解人类自然语言生成自然语言文本和执行某些任务，除了理解自然语言外，还可以解决跨越数学、编码、视觉、医学、法律、心理学等问题。
GPT 通过大量高质量文档的训练，知识非常渊博，通过阅读我们能够得出，GPT 在文科考试、做选择题等方面表现比较好，比如在美国律师资格考试测试中 GPT-4 的成绩可以达到前 10%；但在数学考试，编程表现比较一般。
以编程为例，GPT4 在简单的问题上的正确率为 31/41，在中等难度问题上的正确率为 21/80，在复杂问题上的正确率为 3/45。可以看出，GPT4 在简单问题上表现还算可靠，但并不完全可靠，而在高等和中等难度问题上表现相对较差。
虽然 GPT 能理解自然语言，还能解决一些学科问题，但在自主学习、归纳抽象、逻辑推理、创新、情景感知等智能能力上，存在明显缺陷。比如推理方面，GPT 模型使用前文 token 预测下一个 token，这种预测方法使得 GPT 模型是一种线性思维，而人的思维比这种线性思考复杂多了。另外 GPT 对数据依赖性强，高质量数据对 GPT 非常重要，容易因为低质量数据和错误数据影响，导致 GPT 理解出现不准确和错误。
总之 GPT 不是强人工智能，GPT 让人们看到了强人工智能 AGI 的曙光，但差距依旧巨大。GPT 擅长从海量的知识提取出用户需要的，但在推理，逻辑，抽象，创新等方面存在缺陷。
计算机软件产品交互的发展经历了命令行交互 (阶段 1)、图形用户界面 GUI（阶段 2），随着 GPT 发展，预计会进入 GUI+LanguageUI 结合时代，下面对每个阶段对做下分析。
软件 1.0 时代是文本命令行式的交互，本质上是特定的 Language UI，无法使用很泛的自然语言表达。在这个阶段和系统的交互通过各类 cli 程序，无法使用图形化的界面交互。入门门槛高，使用复杂，不利于大规模的推广，主要面向专业的研发人员。
比如系统提供了根据时间和区域查看指标数据的程序 getMeasureData，接收两个参数 date 和 region，使用方式如下：
输入：getMeasureData -date=2021-10-21 -region=shanghai
输出:
region gmv pv
shanghai 100 20
软件 2.0 GUI 是图形化界面的时代，通过可视化界面的用户操作，为用户提供了直观的界面，容易上手和使用，降低了门槛和覆盖了更多的人群，迎来了计算法软件发展的爆发增长。但随着 GUI 的发展，GUI 逐渐暴露出一些缺点：
GUI 虽然极大的降低了门槛，但是一些场景，如果彻底使用 GUI 表达明显存在问题。比如编写代码，使用编程语言逻辑清晰且一目了然。但如果使用 GUI 描述，很难理解。下面的例子是一段简单的循环 + 打印文本的 javascript 脚本，逻辑非常简单，但可视化 GUI 表达方式明显更加难以理解。
从人类上千年文明发展来看，自然语言才是最适合表达复杂逻辑方式。所以 GUI 表达可以说是一种特定的降低沟通成本表达方式，这是一种偏向视觉的沟通方式，这种方式能成倍的降低计算机工具沟通成本。好比管理沟通的金字塔原理，本质上是对灵活的自然语言通过树形结构拆分，降低沟通成本。
所以 GUI 适合表达和空间位置有关或逻辑简单的信息，不适合表达一些比较抽象的逻辑关系。比如低代码平台，可视化 GUI 编排主要应用在表单、页面组件编排、对象建模等场景，LanguageUI 代码方式应用在自定义组件开发场景。
例子 1 中后台管理系统，随着功能越来越多，相关的菜单和页面功能越来越多，使用系统慢慢变得并不是一件容易的事情，培训成本越来越高；
例子 2 mac 的配置界面，配置项成百上千，了解相关的功能和查找相关的功能并不是一件容易的事情，使用了好几年的用户，可能很多配置项都不了解，平时遇到问题查找相关的配置项可能都需要比较多时间。
上面两个例子，都存在随着软件发展，功能变得越来越多，使用越来越复杂。对于开发者们总是希望能够开发出最为全面、功能最为强大的软件，以满足每个用户的需求。然而，如果软件的功能点太多容易导致核心功能被其他功能所淹没，易用性将会变得很差。
有没有办法我们设计很精简的功能，但同时能满足层出不穷的诉求呢？
事实是不可能的，因为满足越来越多诉求和精简的功能是矛盾体，两者不可兼得。唯一的办法是对功能进行产品架构分层、归类，保证常用功能对于大部分用户简单易用，同时提供比较隐蔽的其他功能入口，满足其他的诉求。这个并不是最根本解决办法，非常用功能的其他功能入口比较深，功能数量多，很多对用户有价值的功能也被淹没了。
那么未来我们软件集成了 AI 能力，能否做到功能全面，但易用性也非常好呢？
为什么阶段 3 是 GUI+LanguageUI 结合时代呢？结合上文我们知道，虽然 GUI 对软件发展意义很大，但他自身也存在一些缺陷。目前随着大模型 AI 技术发展，AI 能够理解自然语言和按照用户的需求执行，在 GUI 时代的一些软件缺陷我们完全可以使用 LanguageUI 交互解决。
我们拿上面 mac 配置举例，我们为他们新增一个智能的助手功能：
Human: 网页打开默认使用了 chrome 浏览器，怎么默认使用 edge
AI: 已经帮你配置完成，请打开该页面查看效果 <https://www.test.com>
Human: mac 电脑锁屏后，会自动断网，帮我设置为不自动断网方式
AI: 已经帮你配置完成，可锁屏后测试
Human: 字号有点小，帮我把字号调整的大一些
AI: 现在字号是 14，帮你调整到了 16
从上面例子可以看出，有了 copilot 智能助手交互后，能够有效解决因为功能多，使用变得越来越困难问题，所以未来大概率是是 LanguageUI 和 GUI 结合的时代，通过 LanguageUI 解决软件发展曾经的一些难题，两者结合 1+1>2。
虽然 AI 时代的 LanguageUI 能力非常强大，但并不是万能的。对 GUI 和 LanguageUI 交互做个对比，GUI 是一种确定式的 UI，有稳定的输入输出，LanguageUI 是非稳定的 UI，不管能否发展出强人工智能，输入和输出并不稳定。自然语言式的 LanguageUI 好比跟人交互，对方对同一句话理解随着环境、心态、经验会有不同的理解和处理方式。处于稳定态的工具更节约资源和成本更低，比如我要看短视频，直接手滑操作相比 LanguageUI 交互是更简单和易用的。
总之 GUI 和 LUI 都有各自的优点、缺点，未来软件是通过合理的设计，最大化的发挥他们的价值。
一句话帮你写文档，处理复杂电子表格，分析表格数据，生成精美的 ppt 等，从最新的 copilot 演示视频看，copilot 已经能做到根据用户的自然语言需求生成 VBScript，提供更加复杂需求支持。
飞书的 copilot 帮你撰写一篇汇报文档，分析一份经营数据，或总结一场错过的会议。
传统的 BI 软件分析依赖于人工，人工分析是一个成本高过程，相比之下，使用 ChatGPT 等大模型技术泛化的自动化数据分析能力可以快速帮助用户找到想看到数据，分析异常，帮助发现遗漏的关键因素。
微软将 Copilot 也接入到了旗下的低代码开发平台 Power Platform 中，用户可以在 Power Apps、Power Virtual Agents 和 Power Automate 中用自然语言描述他们想要的应用、功能和流程，Copilot 可以在几秒钟内完成应用和流程的创建，并提供改进的建议。
一个基于 GPT 的 AI 程序员助手，能够提供代码生成和自动完成功能。它可以直接集成到 Visual Studio Code 编辑器中，在最近的一次发布会上，Github CEO 现场用 Copilot 写代码，18 分钟完成一个游戏的开发，他们希望未来能提升 10 倍程序员的效率。
这个平台利用 GPT 提供营销文案生成服务，帮助用户撰写广告、博客文章、产品描述等。基本体验是通过表单方式把需求提清楚，gpt 帮你完成文案编写。
人脑第二助手，记录你看到、说过或听到的一切。
4 月 28 日，互联网医院医联宣布研制出国内首款大模型驱动的 AI 医生——MedGPT，该产品目前已进入内部测试阶段，计划今年 5 月正式发布。医联称，MedGPT 目前已经拥有近 3000 种疾病的首诊能力，覆盖 80% 以上的成年人疾病和 90% 以上的 0-12 岁儿科疾病。
医联称，MedGPT 采用大模型技术，基于医疗知识图谱为模型提供丰富、准确、结构化的医疗知识，并收集整理接近 20 亿条真实医患沟通对话、检验检测和病例信息进行深度训练学习，同时利用医生真实反馈进行强化学习，用以保障模型的推理质量、准确性与可靠性。
大模型 AI 时代已经来临，第一比尔盖茨说自 1980 年首次看到图形用户界面（graphical user interface）以来，OpenAI 的 GPT 人工智能模型是他所见过的最具革命性的技术进步；第二很多知名公司都在做 LLM 大模型，不少公司开发布会说，所有的产品要用 ai 重构；第三各个知名产品都在集成 LLM 能力，不少公司因为这个股价涨了很多。总之未来用好 AI 的企业能获得更多的机会，建立更深的护城河。
产品交互的进步，影响了人和机器的交互方式，对前端开发者影响也会很大。前端开发者善于学习新的技术，从前端角度完全可以学习最新的 LLM 工程技术，把一系列工程技术应用起来，帮助业务发展更好。产品集成 AI 能力主要用途之一是让产品变的更加易用，本质上是把 GUI 转变到 GUI + LanguageUI，前端同学能够设计端到端的解决方案，相比其他算法、后端同学，我们主业就是做产品的交互，完全可以深耕这方面。
比如下面 mac 例子，本质上都是在处理交互层面的逻辑，更加适合前端开发者设计架构和开发。
Human: 网页打开默认使用了 chrome 浏览器，怎么默认使用 edge
AI: 已经帮你配置完成，请打开该页面查看效果 <https://www.test.com>
Human: 字号有点小，帮我把字号调整的大一些
AI: 现在字号是 14，帮你调整到了 16
重点介绍一些 LangChain 案例:
ls 命令，现在用自然语音描述就可以，无需学习 ls 指令1. 从大的视角看
2. 从应用场景看
3. 从前端技术角度
未来社区将会沉淀出一些面向 LLM 工程的前端框架
降低 LLM 能力集成的复杂度和设计有利于 AI 集成的架构。目前在 github 搜索 ChatGPT typescript 关键字显示仓库有 7000 多，足以看出社区的活跃程度了，是时候去卷 AI 框架了。
2. 各个企业对资深前端同学需求会加大
在未来设计优秀的 AI 应用相对之前有这么几点变化，第一需要在业务理解上做到能提前预判更多的潜在诉求，因为通过自然语言描述的需求是很泛的，系统底层对于很泛的这类需求要有比较系统的解法；第二需要设计合理的架构能够最大化的利用 AI 能力，要想最大化的利用 AI 的能力，除了对 llm 工程技术非常熟悉外，还考察本身系统架构设计能力，比如如何设计底层的视图模型，低成本的让 AI 能够学会，并且在长期是个稳定态，不会随着诉求频繁迭代，每次都有比较大的变更成本。
业务中存在的一些痛点，采用传统 GUI 解决方案可能并不能从根本上解决，GUI 本身存在一定的局限性和发展限制。比如下图中随着系统功能的不断增多，使用成本越来越高。在这种情况下，可以考虑如何在产品中集成人工智能 AI 技术，解决业务中存在的问题和提升用户的体验。
大模型时代，企业对人才的需求变了，AIGC 相关岗位人才难求，薪资持续走高，AI 运营薪资平均值约 18457 元，AI 工程师薪资平均值约 37336 元，大模型算法薪资平均值约 39607 元。
掌握大模型技术你还能拥有更多可能性：
• 成为一名全栈大模型工程师，包括 Prompt，LangChain，LoRA 等技术开发、运营、产品等方向全栈工程； • 能够拥有模型二次训练和微调能力，带领大家完成智能对话、文生图等热门应用； • 薪资上浮 10%-20%，覆盖更多高薪岗位，这是一个高需求、高待遇的热门方向和领域； • 更优质的项目可以为未来创新创业提供基石。
前端工程师在 AI 时代不仅仅是页面的构建者，更是人机交互体验的设计师。我们需要关注以下几点：
人工智能浪潮已至，前端开发者不应被动等待，而应主动拥抱变化。通过掌握 LLM 工程化技术，结合自身的交互设计优势，我们可以在 AI 时代创造出更具价值的产品。未来的前端，将是连接人与智能的桥梁，也是技术变革中最具活力的力量之一。
微信公众号「极客日志」，在微信中扫描左侧二维码关注。展示文案：极客日志 zeeklog
使用加密算法（如AES、TripleDES、Rabbit或RC4）加密和解密文本明文。 在线工具，加密/解密文本在线工具，online
生成新的随机RSA私钥和公钥pem证书。 在线工具，RSA密钥对生成器在线工具，online
基于 Mermaid.js 实时预览流程图、时序图等图表，支持源码编辑与即时渲染。 在线工具，Mermaid 预览与可视化编辑在线工具，online
查找任何按下的键的javascript键代码、代码、位置和修饰符。 在线工具，Keycode 信息在线工具，online
JavaScript 字符串转义/反转义；Java 风格 \uXXXX（Native2Ascii）编码与解码。 在线工具，Escape 与 Native 编解码在线工具，online
使用 Prettier 在浏览器内格式化 JavaScript 或 HTML 片段。 在线工具，JavaScript / HTML 格式化在线工具，online