章
目
录
今天给大伙分享一个AI网站——Devv AI，绝对是程序员的宝藏利器！咱搞开发的时候，谁还没遇到过抓耳挠腮想不出代码咋写，或者被技术难题卡得死死的情况呢？这时候，Devv AI就能派上用场啦！
一、Devv AI到底是啥“神器”？
Devv AI号称是最懂程序员的新一代AI搜索引擎，它的目标就是要替代传统搜索引擎和技术博客社区，专门帮咱解决编程和技术上的各种难题。
Devv AI官网：https://devv.ai/zh
它是基于RAG（检索增强生成）技术和大型语言模型，就像给搜索引擎开了挂一样。它能快速、精准地给出编程相关的查询结果，不支持Python、Go、JavaScript和Java，对咱码农来说，简直太友好了！
而且它还有多种搜索模式，像快速模式、代理模式和GitHub模式，能满足不同开发者的各种需求。它会根据用户的互动不断学习、优化，给咱提供更个性化的搜索体验，就好像它能摸透咱每个程序员的脾气一样。
二、Devv AI里都有哪些AI模型？
Devv AI集成了不少常见的AI模型，这里面比较推荐Gemini 1.5 Pro，因为它有Limited Free限时免费的版本，对咱开发者来说，免费的羊毛不薅白不薅啊！下面给大伙简单介绍一下这些模型：
- Gemini 2.0：这是Google家的模型，功能相当强大，能处理文本、图像、视频和音频多种信息，就像一个全能选手。它的输入上下文窗口有1M tokens，一次请求最多能生成8192个tokens。在各种测试里表现都很亮眼，比如在MMLU-Pro基准测试里得分77.6%，在MMMU（多模态理解）测试里得分71.7%，数学问题解决能力测试里得分90.9% 。
- GPT-4o Mini：OpenAI开发的，性价比很高。支持文本和视觉输入，以后还会支持更多类型的输入。它的输入上下文窗口有128K tokens，单次请求能生成最多16.4K tokens。在MMLU基准测试里得分82%，HumanEval（代码生成）测试里得分87.2% ，数学问题解决能力测试里得分70.2%。
- Gemini 1.5 Pro：虽然是Google的早期版本，但实力也不容小觑，多模态处理能力还是挺强的。在HumanEval基准测试里得分84.1%，不过在数学问题解决能力方面，比GPT-4o Mini和Gemini 2.0稍弱一些。
- Claude 3.5 Sonnet：Anthropic开发的，在编程任务这块表现特别出色，生成的代码质量杠杠的。支持多种模态输入，就是在一些任务里，可能需要一步步引导才能发挥出最佳效果。在HumanEval基准测试里得分92%，MMLU基准测试里得分81.5%，比Gemini 1.5 Pro在编程任务上更胜一筹。
- Claude 3.7 Sonnet：Anthropic更新后的版本，性能又提升了一些。在复杂的数学和编程任务里表现都不错，虽然在ARC-AGI测试里比o1稍弱，但在其他任务里表现还是挺好的。
- DeepSeek R1：DeepSeek开发的，有6710亿参数，属于混合专家（MoE）模型，擅长处理复杂任务，像数学和编程就不在话下。在ARC-AGI测试里得分15 – 20%，MMLU测试里得分79.5%。
- GPT-4o：能处理文本和视觉输入，像图像描述生成、视觉问答这些涉及图像和文本结合的任务，它都能搞定。在MMLU基准测试里得分82%，HumanEval测试里得分87.2%，数学问题解决能力测试里得分70.2%。
- o1-preview：OpenAI的最新模型，推理能力提升明显。在数学和编程评估里准确率高达83%，比GPT-4o高了不少。
三、GitHub模式有啥不一样？
Devv AI的GitHub模式现在还处于Beta测试阶段，不过已经很好用了。通过这个模式，咱能直接把自己的GitHub仓库连接到Devv AI上，然后就能进行搜索、问答和代码生成这些操作。
Devv AI会用专门的程序分析indexer去解析代码仓库的语法结构和函数调用链关系，这样给出的结果就更精准了。而且它的数据来源还包括GitHub等国际知名技术平台，能利用上面的开源代码和项目信息，给开发者提供更全面、更靠谱的编程建议。
另外，Devv AI在GitHub上还有自己的开源仓库，开发者可以在上面报告错误、提新功能需求、提问或者反馈使用感受。这种开放式的社区互动，能让Devv AI不断改进、优化，变得越来越好用。
四、实操体验如何？
我试着在Devv AI上输入提示词“使用代码，创建一个有科技感炫酷的动画”，它的表现真的惊艳到我了！它不仅输出了代码，连效果都能直接看到，这也太方便了，我简直爱惨了这个功能！
它给了几种不同的实现方法：
- 使用CSS动画：这种方法简单易上手，适合做一些简单的动画效果。比如它给的示例代码，创建了三个旋转的圆形，通过设置不同的颜色和动画延迟，就做出了有科技感的动画效果。
- 使用JavaScript和Canvas：用这种方式能创建更复杂的动画。像下面这段代码，创建了一个粒子动画，每个粒子的大小、方向和颜色都是随机的，通过不断更新粒子的位置，实现了动态的效果。
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>粒子动画</title>
<style>
body {
background-color: #000;
overflow: hidden;
height: 100vh;
margin: 0;
display: flex;
justify-content: center;
align-items: center;
}
canvas {
background-color: #000;
}
</style>
</head>
<body>
<canvas id="particleCanvas"></canvas>
<script>
// 获取canvas元素及其2D绘图上下文
const canvas = document.getElementById('particleCanvas');
const ctx = canvas.getContext('2d');
// 设置canvas的宽高为窗口的宽高
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
let particlesArray;
// 粒子类，用于创建和管理粒子
class Particle {
constructor(x, y, directionX, directionY, size, color) {
this.x = x;
this.y = y;
this.directionX = directionX;
this.directionY = directionY;
this.size = size;
this.color = color;
}
// 绘制单个粒子的方法
draw() {
ctx.beginPath();
ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2, false);
ctx.fillStyle = this.color;
ctx.fill();
}
// 更新粒子位置的方法
update() {
// 判断粒子是否碰到左右边界，若碰到则改变水平方向
if (this.x + this.size > canvas.width || this.x - this.size < 0) {
this.directionX = -this.directionX;
}
// 判断粒子是否碰到上下边界，若碰到则改变垂直方向
if (this.y + this.size > canvas.height || this.y - this.size < 0) {
this.directionY = -this.directionY;
}
// 根据方向更新粒子位置并绘制
this.x += this.directionX;
this.y += this.directionY;
this.draw();
}
}
// 初始化粒子数组的函数
function init() {
particlesArray = [];
// 根据canvas的面积计算粒子数量
let numberOfParticles = (canvas.height * canvas.width) / 9000;
for (let i = 0; i < numberOfParticles; i++) {
// 随机生成粒子的大小、位置、方向和颜色
let size = (Math.random() * 5) + 1;
let x = (Math.random() * ((innerWidth - size * 2) - (size * 2)) + size * 2);
let y = (Math.random() * ((innerHeight - size * 2) - (size * 2)) + size * 2);
let directionX = (Math.random() * 5) - 2.5;
let directionY = (Math.random() * 5) - 2.5;
let color = 'rgba(173, 216, 230, 0.8)';
particlesArray.push(new Particle(x, y, directionX, directionY, size, color));
}
}
// 动画循环函数
function animate() {
requestAnimationFrame(animate);
ctx.clearRect(0, 0, innerWidth, innerHeight);
for (let i = 0; i < particlesArray.length; i++) {
particlesArray[i].update();
}
}
// 监听窗口大小变化事件，调整canvas大小并重新初始化粒子
window.addEventListener('resize', function(){
canvas.width = innerWidth;
canvas.height = innerHeight;
init();
});
init();
animate();
</script>
</body>
</html>
- 使用Three.js：Three.js是一个JavaScript 3D库，用它能创建更高级的3D动画。示例代码里创建了一个简单的旋转立方体，要是想做更复杂的3D场景和动画，用它也没问题。
五、Devv AI使用总结
经过这段时间的使用，我真的觉得Devv AI非常实用！GitHub模式更是一大亮点，连接上GitHub仓库后，能针对特定项目获取精准的建议，快速定位代码问题，提供优化思路，大大提升了开发效率，同时也提供了很多学习资源。
虽说现在用Devv AI得借助梯子，但就冲它强大的功能和良好的用户体验，也值得咱去试试，兄弟们赶紧去体验体验！
