ChatGPT、DeepSeek 对比测试

原本是打算测试 MiMo 最新模型的，看论坛有人说会有特调，所以没有使用鹈鹕测试，让 Codex 出了一个测试题

为啥后来没有测试 MiMo ，反而测试了 DeepSeek 呢，主要还是没有订阅😂😂

你是一名高级前端工程师。请实现一个可直接运行的单文件 `index.html`，模拟苹果官网风格的可拖拽折叠手机展示效果。



要求：



1. 只能使用原生 HTML 、CSS 、JavaScript ，不能使用 React 、Vue 、Three.js 、Canvas 、WebGL 、视频或外部依赖。

2. 手机由左右两个屏幕面板和中间转轴组成，使用 CSS 3D 实现：

   - 展开角度为 180°；

   - 半折角度为 90°；

   - 闭合角度为 0°；

   - 右侧面板必须围绕转轴旋转，而不是简单缩放或切换图片。

3. 页面包含：

   - 一个可拖拽的 range 滑块；

   - “横屏”“竖屏”“闭合”“坐立”“站立”五个预设按钮；

   - 当前折叠角度的数值显示；

   - 手机屏幕中的渐变壁纸、文字和几个简单图标。

4. 支持鼠标、触摸和键盘操作：

   - 拖动滑块实时更新 3D 角度；

   - 键盘左右方向键调整角度；

   - Home 设置为 0°，End 设置为 180°；

   - 角度必须限制在 0° 到 180°。

5. 正确处理 CSS 3D 的 `perspective`、`transform-origin`、`transform-style`、`backface-visibility` 和阴影，使折叠时具有真实的空间感。

6. 支持 `prefers-reduced-motion`，用户开启减少动态效果后，不应使用明显的缓动动画。

7. 页面需要响应式适配桌面和移动端，不能出现横向滚动条。

8. 不要使用假的逐帧图片切换来伪造动画。

9. 请先列出不超过 5 条实现假设，然后给出完整代码，最后给出至少 5 个边界测试用例，并说明每个用例的预期结果。

10. 代码必须复制到本地后直接打开即可运行。

测试结果

双方都实现了折叠交互功能

ChatGPT 5.6 Luna 最高

5.6Luna 效果

优点：耗时 7 分钟，页面 UI 强
缺点：它将折叠方向给整反了，把屏幕往后扳

DeepSeek V4 pro （额度花费 4.47 ）

DeepSeek V4 pro 效果

优点：折叠方向正确
缺点：耗时长 12 分钟，UI 没有那么好看