V2EX 07月22日 15:31
[程序员] Vibe Coding 一天内完成图片编辑工具(Trae 又行了?
index_new5.html
../../../zaker_core/zaker_tpl_static/wap/tpl_guoji1.html

 

作者近期高强度使用了 Cursor, Kiro, Trae 三款AI代码助手,并分享了详细的体验。Cursor起初表现优异,但后期出现不遵守规则的问题;Kiro在设计和Claude 4加持下表现出色,但存在思考时间长和死循环等问题。Trae的2.0版本更新后,支持项目规则设置和上下文导入,稳定性高,但在规则交互和需求细节处理上仍有不足。文章还穿插了作者利用AI工具快速开发图片编辑工具的实践经历,强调了AI在提升开发效率方面的潜力,以及架构设计的重要性。最终,在Cursor遭遇IP封锁的情况下,Trae成为作者的首选。

🌟 CursorAI助手:初期凭借其规则设置和流畅交互获得好评,但后期发现其AI模型存在不遵循预设规则、规则丢失等问题,影响了用户体验,有“离职报复”的戏谑感。

🚀 KiroAI助手:以支持Claude 4模型和出色的设计理念(如Spec模式)吸引用户,虽然在处理复杂任务时可能出现思考时间长、死循环等网络或模型问题,但其整体准确度和效率仍得到肯定,并成功辅助开发了图片编辑工具。

💡 TraeAI助手:在更新至2.0版本后,增加了项目规则设置(.trae/rules/project_rules.md)和上下文导入功能,提升了代码输出的稳定性,尤其是在处理细致需求时,能够更好地控制AI行为,成为作者在Cursor受限后的首选。

🛠️ AI辅助开发实践:作者利用AI工具(如Kiro)在短时间内(约8小时)完成了功能完善的图片编辑工具(imgx.zzao.club),展示了AI在加速原型开发和复杂功能实现方面的巨大潜力,并强调了清晰的架构设计是AI高效发挥的关键。

⚖️ 开发者工具选择考量:文章对比了三款AI助手的优劣,并结合了实际使用中的问题(如Cursor的IP封锁),反映了开发者在选择和使用AI工具时,需要综合考虑模型能力、交互设计、稳定性、成本以及实际项目需求等多个维度。

最近一段时间高强度使用 CursorKiroTrae 这三大编辑器。

最开始用 Cursor, 用的 fake cursor 插件,只嫖一个免费版( claude 3.5 )。 一用真香啊,能设置 rules,不跑题,交互也丝滑。

然而用的多了,没两天时间,感觉就不守规矩了。rules 要么就是漏下,要不就完全不遵守了。感觉是要从我手下离职,要报复我一样...🥲

自动从聊天中中总结一些临时规则虽然不错,但换了电脑好像就没了,隔一段时间好像也会自动没(?)。

这时候开始出现一些 Kiro 的宣传文章,我正好有用,就火速下载体验。

谁让他能用 Claude4

体验一番后,感觉他的设计思路很不错,尤其是 Spec 模式。但我还是 Vibe 模式用的多。

也可能是 Claude4 的加持效果太好,从 3.54,像是从村里进城一样,哪哪都是好啊...

唯一的问题可能在我

这种可能是网络问题导致重试情景时常出现

而且思考时间要比 cursortrae 长很多。

由于思考时间长(可能是上下文多),还会出现死循环,不停的在解决同一个问题。

但是总体还是帮我干了很多活,准确度非常高

(但两天就被我把额度干没了)

比如我这个只用了一天时间就做出来的图片编辑工具

https://zzao.club/imgx

右键出现操作面板,支持无限分割格子

也可以分割后再把格子删掉。删掉后又可以让格子补齐它的空位。

也可以设置圆角、间距。

同时也支持直接粘贴刚刚复制的图片。

理论上可以出现任何布局

没有图片的格子就会被绘制成透明背景。

分图功能,可以将上传的图片,分布到每个格子中。

也支持再次拆分格子,再次上传图片

如果再次切换回拼图模式,就可以再次重新给小格子上传图片

当然,再次切换到分图,就会重新把新上传的图片重新分割。

然后就是一个简单的长图功能。支持横向和纵向。

可以选完再上传图片,也支持传完再切换比例。

以上就是全部功能了(目前纯前端功能),总体用时在 8 小时以内,具体几个小时记不清了,因为我是每天写一部分。

比较关键的点就是: 要先定一个总体的架构,不管是自己写,还是让 AI 自己写,先把基本思路完全敲定。

比如我这个图片工具,核心就是维护一组数组数据,页面渲染完全依靠这组数据,调整参数就是调整数据。导出也是用数据在原生 Canvas 上重绘完全一致的页面,然后导出。

这样不管是分割格子,还是上传图片,分割图片,长图,本质都是处理这组数据。扩展性还是很高的,就算完全转为后端渲染也很轻松支持。

如果是采用了依靠 html 渲染内容,在使用 html2canvas 导出 html 内容。一是把场景限制在了浏览器上,二是需要特殊处理元素上的交互,避免导出不需要渲染的元素、辅助线等。

至于为什么做这种图片工具。

这算是我在 25 年 2 月份构思的图片工具的一部分。

一开始先做的第一部分( IMG ),也就是文字生图片,还在 V2EX 发了贴原贴

很快就 100 多 star 了。

但可能大部分只是有兴趣,提出问题的人很少,所以我在迭代完所有内容,并且经历了一次比较大的重构。目前支持自定义模板,自定义预设,然后使用一个预设码去拿到自己想要的图片。

https://imgx.zzao.club/008/default 比如这个链接

https://imgx.zzao.club/008/随意更改标题/对对对/和副标题/菜鸟

也支持直接触发下载,点开链接即可保存图片 (不过微信了不让你打开下载,会提示去浏览器

https://imgx.zzao.club/008/default?download=1

当初这个功能,吭哧吭哧做了一两个月,那时候我还是古法敲制的代码...

而图片处理这部分,一天不到就用 AI 搞完了

Kiro 完成了拼图和分图功能后,我正在头疼没额度了怎么办

突然 Trae 给我自动续费了。。。

此时我还在心里咒骂 Trae

本着钱都花了就试试吧的想法打开了 Trae

然后惊喜的发现它更新了 2.0 了!

并且也能和 Cursor 一样设置 .trae/rules/project_rules.md ,以前没注意它能不能设置上下文,现在才发现能设置项目的上下文,也能导入更多的上下文

但这个 rules 仅仅就是放在这里,供它使用,你在对话中让他去操作这个 rules,自己写入,他完全不理解往哪里写,说明对话模式里没设计和 rules 的交互。

但是我也比较满意了

毕竟这么多可以用的模型,2 天内也没发现网络错误之类的问题,很稳定。

而且我只是让他不要跑出我的把控,所以有 rules 之后输出的代码就很稳定。

然后我就继续用 Trae 完成了长图功能。

非常坎坷,需求太细致了,反而不利于 AI 发挥。

但是你让它完全自由发挥,十分不可控,扩展性也比较差。正常的扩展性指的是方便支持更复杂的功能,毕竟以前需要手写。

现在对于 AI 来说,什么扩展性不扩展性的,就算重写整个项目都用不了太长时间。。

另外,SOLO 模式用不了,没码!

在我畅快的使用 Trae 时,前线又传来了 Cursor 封锁中国 IP 的消息!

突然,此刻的 Trae 显得格外好用....

根本不认识什么 cursor 和 kiro !

Fish AI Reader

Fish AI Reader

AI辅助创作,多种专业模板,深度分析,高质量内容生成。从观点提取到深度思考,FishAI为您提供全方位的创作支持。新版本引入自定义参数,让您的创作更加个性化和精准。

FishAI

FishAI

鱼阅,AI 时代的下一个智能信息助手,助你摆脱信息焦虑

联系邮箱 441953276@qq.com

相关标签

AI代码助手 Cursor Kiro Trae AI开发
相关文章