邓文兵
450056ee4a
- 新增关于Qwen3.5登顶中国第一的深度技术解读文章 - 添加LMArena评测机制可视化图表页面 - 添加Qwen3.5 MoE混合专家架构示意图 - 添加综合能力跑分对比图表 - 添加价格对比可视化页面 - 添加使用场景推荐图表 - 更新.gitignore文件添加.playwright-mcp目录忽略规则
71 lines
4.3 KiB
HTML
71 lines
4.3 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<style>
|
||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||
body { width: 1200px; height: 680px; background: linear-gradient(135deg, #0f0c29, #302b63, #24243e); font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; display: flex; align-items: center; justify-content: center; color: #fff; }
|
||
.container { width: 1100px; }
|
||
h2 { text-align: center; font-size: 32px; margin-bottom: 40px; background: linear-gradient(90deg, #a78bfa, #60a5fa); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
|
||
.main { display: flex; gap: 40px; align-items: center; justify-content: center; }
|
||
.left { display: flex; flex-direction: column; gap: 16px; align-items: center; }
|
||
.param-box { background: rgba(167,139,250,0.15); border: 2px solid #a78bfa; border-radius: 16px; padding: 20px 32px; text-align: center; }
|
||
.param-box .big { font-size: 48px; font-weight: 800; color: #a78bfa; }
|
||
.param-box .label { font-size: 14px; color: rgba(255,255,255,0.6); margin-top: 4px; }
|
||
.center-visual { position: relative; width: 360px; height: 360px; }
|
||
.expert { position: absolute; width: 80px; height: 80px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 600; border: 2px solid rgba(255,255,255,0.2); background: rgba(255,255,255,0.05); color: rgba(255,255,255,0.4); transition: all 0.3s; }
|
||
.expert.active { border-color: #34d399; background: rgba(52,211,153,0.2); color: #34d399; box-shadow: 0 0 20px rgba(52,211,153,0.3); }
|
||
.router { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100px; height: 100px; border-radius: 50%; background: linear-gradient(135deg, #6366f1, #8b5cf6); display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 700; box-shadow: 0 0 30px rgba(99,102,241,0.4); }
|
||
.right { display: flex; flex-direction: column; gap: 16px; }
|
||
.feat { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 12px; padding: 16px 20px; width: 280px; }
|
||
.feat .ft { font-size: 15px; font-weight: 700; color: #60a5fa; margin-bottom: 4px; }
|
||
.feat .fd { font-size: 13px; color: rgba(255,255,255,0.6); line-height: 1.5; }
|
||
.bottom { text-align: center; margin-top: 32px; font-size: 16px; color: #fbbf24; font-weight: 600; }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<h2>Qwen3.5 MoE 混合专家架构</h2>
|
||
<div class="main">
|
||
<div class="left">
|
||
<div class="param-box">
|
||
<div class="big">3970 亿</div>
|
||
<div class="label">总参数量 (397B)</div>
|
||
</div>
|
||
<div style="font-size: 28px; color: #60a5fa;">↓ 仅激活</div>
|
||
<div class="param-box" style="border-color: #34d399; background: rgba(52,211,153,0.15);">
|
||
<div class="big" style="color: #34d399;">170 亿</div>
|
||
<div class="label">激活参数 (A17B) ≈ 4.3%</div>
|
||
</div>
|
||
</div>
|
||
<div class="center-visual">
|
||
<div class="router">路由器<br>Router</div>
|
||
<div class="expert active" style="top:10px;left:140px;">专家 1</div>
|
||
<div class="expert" style="top:50px;left:260px;">专家 2</div>
|
||
<div class="expert active" style="top:150px;left:280px;">专家 3</div>
|
||
<div class="expert" style="top:250px;left:260px;">专家 4</div>
|
||
<div class="expert" style="top:280px;left:140px;">专家 5</div>
|
||
<div class="expert" style="top:250px;left:20px;">专家 6</div>
|
||
<div class="expert active" style="top:150px;left:0px;">专家 7</div>
|
||
<div class="expert" style="top:50px;left:20px;">专家 8</div>
|
||
</div>
|
||
<div class="right">
|
||
<div class="feat">
|
||
<div class="ft">线性注意力</div>
|
||
<div class="fd">Gated Delta Networks，大幅降低长文本处理的计算开销</div>
|
||
</div>
|
||
<div class="feat">
|
||
<div class="ft">原生多模态预训练</div>
|
||
<div class="fd">文本 + 图像 + 视频混合训练，非后期拼接</div>
|
||
</div>
|
||
<div class="feat">
|
||
<div class="ft">推理效率提升</div>
|
||
<div class="fd">显存降低 60%，吞吐量提升最高 19 倍</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="bottom">不到 40% 的参数量，达到上一代万亿参数 Qwen3-Max 的性能水平</div>
|
||
</div>
|
||
</body>
|
||
</html>
|