BOOTSTRAP · Vite + three
设备像素比与性能上限Device pixel ratio cap
根据 DPR 与移动端策略设置 renderer.setPixelRatio，避免 4K 屏上帧率崩盘。
效果预览
轻量 WebGL 示意（非完整工程实现），可拖拽旋转；完整逻辑见下方提示词。
预期产出 · Returns
Vite 示例：可切换「自动 / 上限 1.5 / 上限 2」的 DPR 策略，角落显示当前 DPR 与 canvas 分辨率。
适合用在哪
任何需要兼顾清晰度与帧率的 Web 3D 页，尤其是手机端展示。
容易踩的坑
- 只 cap DPR 不减少场景复杂度，高面数仍会卡。
提示词 · Prompt
在 Vite + Three.js 项目中实现可配置的像素比策略：
1) 读取 window.devicePixelRatio，提供常量 MAX_DPR（默认 2）与 mobile 检测；
2) 函数 getEffectiveDpr() 返回 min(devicePixelRatio, MAX_DPR) 或在低端机强制 1；
3) resize 时 setSize 使用 clientWidth/Height，setPixelRatio 使用 getEffectiveDpr()；
4) 页面 UI 三个按钮切换策略并立即生效；
5) 中文注释解释为何 uncapped DPR 会四倍像素。
输出相关工具函数与 main.js 改动。
Vite: configurable max DPR, resize handling, UI to switch strategies, explain retina cost in comments.