Smol AI 🐣 与 Wasp AI 🐝——哪个是更好的 AI 初级开发人员?

2025-06-07

Smol AI 🐣 与 Wasp AI 🐝——哪个是更好的 AI 初级开发人员?

TL;DR

AI辅助编码工具正在兴起。本文将深入探讨两种使用类似技术但目标不同的工具。

Smol AI 的“Smol-Developer”作为首批此类工具之一,很快就声名鹊起。它是一组简单的 Python 脚本,允许用户使用自然语言以迭代方式构建原型应用程序。

Wasp 的“GPT Web App Generator”更像是一个新手,专注于通过简单的提示和精美的 UI 构建更复杂的全栈 React + NodeJS Web 应用程序原型。

两者相比,Smol-Developer 的优势在于其多功能性。如果您愿意花时间进行修改和调整,您可以对自己的提示甚至代码进行大量修改,以便在各种应用程序上获得不错的效果。

另一方面,Wasp AI 的优势在于其针对性。由于它专为生成全栈 React/NodeJS/Prisma/Tailwind 代码库而构建,因此它会为您进行调整和高级提示,因此它在针对特定用例以更少的投入生成更高质量内容方面表现更佳。

图片描述

这些工具中的任何一个都会完全取代目前的初级开发人员吗?当然不会。但它们确实允许快速构建原型并测试新想法。

继续阅读以了解有关它们的工作原理、哪种工具适合手头的工作以及如何在当前工作流程中使用它们的更多信息。

简介

AI辅助编码工具的时代已经全面到来。GitHub的Copilot或许是首选的专业解决方案,但自其发布以来,已经涌现出众多开源解决方案。

这些较新的解决方案大多倾向于充当人工智能代理,它们不仅仅是在当前文件中建议接下来的逻辑代码片段,还旨在创建整个应用程序的简单原型。有些解决方案更侧重于从初始提示开始构建整个应用程序原型,而另一些则充当交互式助手,帮助您修改和改进现有的代码库。

无论如何,他们通常被描述为“AI 初级开发人员”,因为他们可以根据产品需求(即“提示”)构建一个相当不错(但远非完美)的第一次迭代,从而为开发人员节省大量时间。

本文将重点介绍两个旨在通过单个命令构建较为复杂的工作原型的工具:Smol AIWasp AI。我们将通过在每个工具上运行相同的命令并查看结果来测试它们。

到最后,您将对它们的工作原理、优点和缺点以及它们最适合执行哪种任务有相当好的了解。

开始之前

Wasp = }是唯一开源、完全服务器化的全栈 React/Node 框架,具有内置编译器和 AI 辅助功能,可让您超快速地构建应用程序。

我们正在努力帮助您尽可能轻松地构建高性能 Web 应用程序 - 包括创建每周发布一次的此类内容!

如果您能通过在 GitHub 上关注我们的 repo 来帮助我们,我们将非常感激:https://www.github.com/wasp-lang/wasp 🙏

请请请

…甚至 Ron 也会在 GitHub 上为 Wasp加星标🤩

⭐️感谢您的支持🙏


工具

Smol-开发者

Smol AI(被描述为“模型蒸馏和 AI 开发代理”平台)实际上提供了一些开源工具,但我们将要介绍的是 Smol-Developer。它最初由Swyx于 5 月 11 日发布,目前已获得超过 1 万个 GitHub 星标!

它旨在成为一个通用的、基于提示符的命令行编程助手。开发者的工作变成了一个反复提示、测试、再提示的过程,以获得最佳输出。它不受任何语言或应用类型的限制,尽管简单的应用往往效果最佳。

请查看下面的推文以获得更好的理解:

从命令行运行,Smol AI 本质上是通过 Python 脚本对 OpenAI 聊天完成(即“ChatGpt”)端点进行一系列调用,这些脚本:

  1. 接受用户生成的初始提示
  2. 根据内部提示*创建执行应用程序的计划:
    1. 整个应用程序的结构
    2. 要生成的每个文件及其导出的变量
    3. 函数名称
  3. 根据计划生成文件路径
  4. 循环遍历文件路径并根据计划和提示为每个文件生成代码

然后,开发人员可以评估生成的输出,并且可以迭代提示以解决运行时发现的任何错误或缺陷。

Smol-Developer 是同类工具中最早出现的之一,而 Swyx 也在其中占据了主导地位,因此迅速声名鹊起。所以,如果你想了解它正在构建什么,只需查看 YouTube 上关于它的众多视频即可。

我个人最喜欢的是 AI Jason 的揭露和评论。他给出了简洁的解释,展示了一些关于如何有效使用 Smol-Developer 的实用技巧,并且作为一名产品设计师/经理,他从有趣的角度阐述了 Smol-Developer 的优势:

Wasp 的 GPT Web 应用生成器

与 Smol-Developer 不同,Wasp 的 AI 工具GPT Web App Generator目前是一个开源的 Web 应用(没错,它就是一个用来创建 Web 应用的 Web 应用)。自 7 月 12 日发布以来,已生成超过 6500 个应用,平均每天生成超过 300 个!

图片描述

以下是一段 1 分钟的简短视频,展示了GPT Web App Generator 的工作原理:

简单介绍一下背景:Wasp实际上是围绕编译器和配置文件构建的全栈 Web 应用框架。通过这种方式,Wasp 可以简化 Web 应用的创建过程,它能帮您处理样板代码,提取开发人员编写的核心应用逻辑,并将整个技术栈(从前端到后端,以及数据库管理)连接起来。

它目前兼容 React、NodeJS、Tanstack-Query 和 Prisma,并支持 Auth、路由、Cron Jobs、Fullstack Typesafety 和缓存等功能。这使得开发人员可以专注于更有趣的部分,例如应用程序的功能,而不是花时间进行枯燥的配置。

由于 Wasp 使用编译器和配置文件来生成应用程序,这使得它非常适合指导像 ChatGPT 这样的 LLM 使用它来创建更复杂的应用程序,因为它本质上是一个关于如何构建应用程序的计划或一组指令!

举个简单的例子来说明如何告诉 Wasp 您希望username and password在应用中进行身份验证:

// main.wasp file

app RecipeApp {
  title: "My Recipes",
  wasp: { version: "^0.11.0" },
  auth: {
    methods: { usernameAndPassword: {} },
    onAuthFailedRedirectTo: "/login",
    userEntity: User
  }
}

entity User {=psl  // Data models are defined using Prisma Schema Language.
  id          Int        @id @default(autoincrement())
  username    String     @unique
  password    String
  recipes     Recipe[]
psl=}
Enter fullscreen mode Exit fullscreen mode

Wasp 的配置文件就像一个应用程序大纲,编译器可以理解它,然后可以使用它来连接和粘合应用程序,为您处理样板。

通过利用 Wasp 的功能,GPT Web App Generator 的工作原理如下:

  1. 通过 UI 接受简单的用户生成提示
  2. 通过内部提示向 GPT 提供 Wasp 应用程序和配置文件的描述性示例*
  3. 制定满足这些要求的计划
  4. 根据计划生成应用程序每个部分的代码
  5. 检查每个文件是否存在预期的错误/幻觉并修复它们

最后,用户可以将代码库下载为压缩文件并在本地运行。一些简单的应用程序,例如TodoApp 或 MyPlants,通常可以直接使用,而更复杂的应用程序则需要一些技巧才能运行。

对比测试

提示 1:PONG 游戏

为了了解每个编码代理的性能,我在 Smol-Developer 和 Wasp 的 GPT Web App Generator 上尝试了两个不同的提示,只对提示进行了轻微的修改以满足每个工具的要求。

第一个提示是硬编码到 Smol-Developer[main.py](http://main.py)脚本中的默认提示:

a simple JavaScript/HTML/CSS/Canvas app that is a one player game of PONG. 
The left paddle is controlled by the player, following where the mouse goes. 
The right paddle is controlled by a simple AI algorithm, which slowly moves the paddle toward the ball at every frame, with some probability of error. 
Make the canvas a 400 x 400 black square and center it in the app. 
Make the paddles 100px long, yellow and the ball small and red. 
Make sure to render the paddles and name them so they can controlled in javascript. 
Implement the collision detection and scoring as well. 
Every time the ball bounces off a paddle, the ball should move faster.
Enter fullscreen mode Exit fullscreen mode

注意ℹ️
对于 Wasp 的 GPT Web App Generator,我将第一行替换为“一个简单的单人 PONG 游戏”,因为 Wasp 将自动生成一个全栈 React/NodeJS 应用程序。

两款程序都能开箱即用地创建出一个功能齐全的 PONG 游戏,但只有在第二次尝试时才成功。第一次尝试创建了不错的 PONG 启动器,但游戏逻辑都存在 bug(例如,电脑对手没能击中球,或者球旋转着飞出去了)。我完全没有修改提示符,只是简单地运行了两次——结果就成功了!

图片描述

图片描述

这两个生成的应用的游戏逻辑都非常简单。没有记录分数,游戏结束后,你必须刷新页面才能开始新的游戏。

尽管 Smol-Developer 仅创建了游戏逻辑,但 GPT Web App Generator 创建了游戏逻辑以及身份验证、创建游戏和更新游戏分数的逻辑,并将其全部保存到数据库中(尽管最初并未使用计分功能)。

公平地说,这并不奇怪,因为这些功能已经融入 Wasp 和 Generator 的设计中。

另一方面,为了让 Smol-Developer 获得相同的功能,我们必须详细说明我们的提示,为其提供明确的指令来实现它们,并在找到可接受的原型之前对其进行多次迭代。

这是我尝试用第二个提示进行测试的内容。

提示 2:博客应用程序

图片描述

这次,对于第二个应用程序测试,我使用了 GPT Web App Generator 主页上的默认提示来创建博客应用程序:

A blogging platform with posts and post comments.
User owns posts and comments and they are saved in the database.
Everybody can see all posts, but only the owner can edit or delete them. Everybody can see all the comments.
App has four pages:

1. "Home" page lists all posts (their titles and authors) and is accessible by anybody. 
If you click on a post, you are taken to the "View post" page.
It also has a 'New post' button, that only logged in users can see, and that takes you to the "New post" page.
2. "New post" page is accessible only by the logged in users.
It has a form for creating a new post (title, content).
3. "Edit post" page is accessible only by the post owner. 
It has a form for editing the post with the id specified in the url.
4. "View post" page is accessible by anybody and it shows the details of the post with the id specified in the url: its title, author, content and comments.
It also has a form for creating a new comment, that is accessible only by the logged in users.
Enter fullscreen mode Exit fullscreen mode

注意:💡
对于 Smol-Developer 提示,我添加了以下几行:“该应用程序由一个 React 客户端和一个 NodeJS 服务器组成。帖子使用 Prisma ORM 保存在 sqlite 数据库中。”

由于这是 GPT Web App Generator 页面上的建议提示,让我们首先从 Wasp 应用程序结果开始。

下载生成的代码库并运行应用程序后,我遇到了一个错误Failed to resolve import "./ext-src/ViewPost.jsx" from "src/router.jsx". Does the file exist?

图片描述

快速浏览一下main.wasp文件就会发现,生成器给出了错误的页面路径ViewPost,尽管它确实给出了所有其他页面路径的正确信息(上面以黄色突出显示)。

路径修改完成后,localhost:3000 上就会弹出一个可以运行的应用程序。太棒了!

上面的视频是我第一次尝试这个应用,正如你所见,大部分功能都已实现并正常运行——身份验证、授权以及基本的 CRUD 操作。真是太棒了!

仍然存在一些错误,导致应用程序无法完全正常运行,但这些问题很容易修复:

  1. 主页上的博客文章没有链接,无法重定向到其特定的文章页面 - 只需将其包装在<Link to={/post/${post.id}中即可解决}>
  2. 客户端将postId作为字符串而不是作为Int端点传递getPost- 可以通过将参数包装在parseInt(postId)将字符串转换为整数来修复

图片描述

经过这些简单的修复,我们终于得到了一个功能齐全、功能齐全的全栈博客应用,它拥有身份验证、数据库和简单的 Tailwind CSS 样式!最棒的是,这一切从开始到结束只花了大约 5 分钟。太棒了 :)

注意🧑‍💻
生成器会保存其创建的所有应用程序以及可共享的链接,因此如果您想查看上面生成的原始博客应用程序代码(修复之前),请单击此处:https://magic-app-generator.wasp-lang.dev/result/a3a76887-952b-4774-a773-42209c4bffa8

Smol-Developer 的结果也令人印象深刻,它拥有稳定的 ExpressJS 服务器和大量的 React 客户端页面,但有太多复杂的错误阻止我启动应用程序,包括但不限于:

  1. 没有构建工具或配置文件
  2. 服务器正在导入不存在的数据库模型
  3. 服务器正在导入,但未使用 Prisma 作为 ORM 与数据库进行通信
  4. 客户端有 Auth 逻辑,但没有利用它来保护页面/路由

图片描述

由于该应用程序存在太多基本问题,因此我继续在提示底部添加了一些行:

搭建应用程序的脚手架,以便能够使用 Vite 作为客户端的构建工具。包含一个 package.json 文件,其中包含运行客户端和服务器所需的依赖项和脚本。

第二次尝试产生了一些我正在寻找的更改,例如用于引导 React 应用程序的 package.json 文件和 Vite 配置文件,但仍然未能包含:

  1. index.html 文件
  2. 从客户端和服务器导入具有正确依赖项的 Package.json 文件
  3. 一个prisma.schema文件
  4. 一个 css 文件(尽管它确实包含classNames在 jsx 代码中)

另一方面,服务器代码虽然这次更加稀疏,但至少正确导入并使用了 Prisma。

因此我进行了第三次尝试,修改并在提示符的底部添加了以下几行:

搭建应用程序脚手架以便能够使用 Vite 作为客户端的构建工具。

确保包含以下内容:

  1. 为服务器和客户端分别创建 package.json 文件。确保这些文件包含各自应用中需要导入的依赖项。
  2. 客户端公共文件夹中有一个 index.html 文件,以便 Vite 可以构建应用程序。
  3. 包含模型及其字段的文件prisma.schema。确保这些模型与整个应用范围内使用的模型相同。
  4. className一个样式与应用程序中使用的样式相匹配的 css 文件。

有了这些添加到提示符中的功能,应用程序的第三次迭代确实包含了它们!好吧,大部分都包含了,但不幸的是,不是全部。现在我获取到了 css 和 package.json 文件,但这次没有创建 vite 配置文件,尽管之前使用“Vite 作为客户端构建工具”的说明已经生成了一个。

除此之外,没有实施任何授权逻辑,导入不适当或丢失,并且index.jsx文件也无处可寻,所以我决定就此打住。

图片描述

我确信我可以对提示进行足够多次的迭代,直到我接近一个可以运行的应用程序,但是每代大约 0.80 美元到 1.20 美元,我不想再支付更多的 OpenAI 费用。

注意💸
每代价格是 Smol AI 和 Wasp AI 之间的另一个巨大差异。由于 Wasp 的编译器完成了更多工作,而 GPT 完成了较少工作,因此生成每个应用程序的成本约为 0.10 至 0.20 美元(尽管 Wasp 承担了成本并允许您免费使用),而使用Smol-Developer 生成复杂的全栈应用程序的成本可能高达 10.00 美元

此外,有很多 YouTube 用户制作了有关使用 Smol-Developer 过程的视频,他们似乎都得出了类似的结论:您需要创建一个非常详细和明确的提示才能获得可运行的原型(事实上,在上面 AI Jason 的 Smol-AI 视频中,他提到,当提示 Smol-Developer 将所有内容写入一个文件时,他获得了最好的结果——当然,这限制了您只能生成不太容易手动继续的简单应用程序)。

思考与进一步考虑

从本质上讲,SmolAI 和 WaspAI 的功能非常相似,都是首先提示 LLM 为应用程序的架构创建一个计划,然后逐个文件地执行该计划。

但由于 Smol-Developer 的目标是能够生成更广泛的应用程序,因此它期望开发人员(或“提示工程师”)能够创建高度详细、明确的提示,这更类似于产品设计师编写的产品需求文档。这可能需要多次迭代才能完成,并将 Smol-Developer 推向“自然语言编程”工具的方向。

另一方面,Wasp 的 GPT Web 应用生成器在后台进行了大量提示和编程,这些操作已从用户抽象出来,隐藏在生成器代码和 Wasp 编译器中。Wasp 内置了大量知识,并且已经清楚地了解了它想要构建的内容,这意味着用户无需过多思考。这意味着我们更有可能通过简短的提示获得一个可运行的复杂原型,但在创建应用类型的灵活性方面有所欠缺——我们最终得到的是一个全栈 Web 应用。

总的来说,Wasp 就像一个专门从事 Web 开发的初级开发人员,在特定堆栈方面拥有丰富的经验,而 Smol AI 则是一个初级开发人员,是一个多面手,但对 Web 开发的具体知识和经验较少 🙂

小分子AI 黄蜂人工智能
🧑‍💻 应用程序类型 多种多样 全栈 Web 应用
🗯 编程语言 所有类型 JavaScript/TypeScript
📈 生成应用程序的复杂性 简单到中等 中等至复杂
💰 每代价格——通过 OpenAI 的 API 0.80 至 10.00 美元 0.10 至 0.20 美元 
💳付款方式 自带 API 密钥 免费 — 由 Wasp 支付
🐛 调试 是的,如果你愿意修改 内置,但功能有限
🗣 所需提示类型 复杂而详细,1 页或多页(例如整个产品需求文档) 简单,1-3段
😎 目标用户 想要生成各种简单原型的工程师、产品设计师 想要功能丰富的全栈 Web 应用原型的 Web 开发人员和产品设计师

其他重大差异在于:

  1. 代码创建时的错误纠正
    1. Smol AI 最初有一个调试脚本,但由于它在调试时需要整个代码库,因此该脚本已被暂时弃用,并且当前的 32k 和 100k 令牌上下文窗口目前仅在 GPT4 和 Anthropic 的私人测试版中可用。
    2. Wasp AI 在其流程中融入了一些错误纠正功能,因为 Wasp 应用程序的结构更加明确,错误范围更加可预测。
  2. 通过 OpenAI 的聊天完成端点生成每个应用程序的价格
    1. Smol AI 的成本从约 0.80 美元到 10.00 美元不等 ,具体取决于应用程序的复杂程度
    2.  使用 GPT 4 和 GPT 3.5 Turbo 的默认组合时,Wasp AI 每个应用的成本约为0.10 至 0.20 美元,但 Wasp 会承担这部分费用。如果您选择仅使用 GPT4运行,则成本将是 10 倍, 每代1.00 至 2.00 美元,并且您必须提供自己的 API 密钥。
  3. 用户界面
    1. Smol Developer 通过命令行工作,具有最少的日志记录和流程反馈
    2. Wasp AI 目前使用简洁的 Web 应用程序 UI,具有更多日志记录和反馈功能,以及通过没有 UI 的命令行(此时您必须下载实验性的 Wasp 版本才能执行此操作)。

总体而言,这两种解决方案都取得了惊人的成果,让个人开发者或团队能够比以前更快地迭代创意并生成原型。但它们仍有很大改进空间。

例如,这些工具目前最缺乏的是交互式调试和增量生成功能。如果它们能够允许用户动态生成附加代码并修复代码库中的问题,而不是返回、重写提示符并重新生成整个代码库,那就太好了。

我不知道 Smol AI 路线图,但看到它获得了Vercel 的 AI 加速器计划的资助,我相信我们会看到它继续发展并且工具得到改进(如果您确实有一些见解,请在评论中告诉我)。

另一方面,作为 Wasp 团队的一员,我可以自信地说,Wasp 很快就会将初始生成过程和交互式调试添加到 Wasp 的命令行界面中!

所以我绝对认为现在还为时过早,这些工具将继续进步 — — 并继续产生更令人印象深刻的结果🚀

您应该使用哪种工具?

显然,这里没有明显的赢家,因为您作为下一个“AI 初级开发人员”应该使用哪种工具这个问题的答案很大程度上取决于您的目标。

您是否正在寻找一款能够生成各种简单应用程序的工具?您是否有兴趣了解更多关于构建 AI 辅助编码工具和自然语言编程的知识,并且不介意花些时间进行调整和修改?那么,Smol-Developer就是您的最佳选择!

想要快速轻松地生成一个功能齐全的全栈 React/Node 应用原型吗?那就来 Wasp 的GPT Web 应用生成器吧



助我助你🌟
如果您还没有在 GitHub 上为我们点赞,尤其是在您觉得这篇文章有用的情况下!如果您点赞了,将有助于我们创作更多类似的内容。如果您没有点赞……我想,我们会处理。

https://media.giphy.com/media/3oEjHEmvj6yScz914s/giphy.gif

⭐️感谢您的支持🙏


总的来说,正如 Jason “AI Jason” Zhou 所说:

我对 [AI 辅助编码工具] 感到非常兴奋,因为如果我想对某个产品创意进行用户测试,我可以让它非常快速地构建原型,并让真实用户进行测试”

杰森在这里提出了一个很好的观点,这些工具实际上并没有能力完全取代初级开发人员目前的能力(尽管它们将来肯定会有所改进),但它们确实提高了我们尝试新想法的速度和便利性!

我个人相信,在不久的将来,我们将看到更多面向特定领域的AI辅助工具,例如Wasp的GPT Web App Generator,因为它们能够为最终用户带来性能提升。专注于特定领域的代码代理由于其内置的知识,可以开箱即用地提供更佳的结果。未来,我认为我们可以期待看到许多针对特定任务进行量身定制的代理。

但不要只听我说。快来亲自尝试一下Smol-DeveloperGPT Web App Generator,并在评论区告诉我你的想法!

文章来源:https://dev.to/wasp/smol-ai-vs-wasp-ai-which-is-the-better-ai-junior-developer-4fcb
PREV
史上最烦人的 Cookie 横幅 黑客马拉松 🤬🍪
NEXT
您应该使用开源 SaaS 样板启动器还是 300 美元以上的付费启动器?