性能优化:精灵降采样、像素比降低、麂皮法线降分辨率
- 时间轴文字精灵超采样 SS 4→2,显存省 75% - Three.js 像素比上限 2→1.5,Cesium resolutionScale 1.5→1.0 - 麂皮法线贴图 1024×1280→512×640,启动逐像素计算省 75%
This commit is contained in:
+1
-1
@@ -64,7 +64,7 @@ export class App {
|
|||||||
_initRenderer() {
|
_initRenderer() {
|
||||||
const canvas = document.getElementById('scene');
|
const canvas = document.getElementById('scene');
|
||||||
this.renderer = new THREE.WebGLRenderer({ canvas, antialias: true });
|
this.renderer = new THREE.WebGLRenderer({ canvas, antialias: true });
|
||||||
this.renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));
|
this.renderer.setPixelRatio(Math.min(window.devicePixelRatio, 1.5));
|
||||||
this.renderer.setSize(window.innerWidth, window.innerHeight);
|
this.renderer.setSize(window.innerWidth, window.innerHeight);
|
||||||
this.renderer.shadowMap.enabled = true;
|
this.renderer.shadowMap.enabled = true;
|
||||||
this.renderer.shadowMap.type = THREE.PCFSoftShadowMap;
|
this.renderer.shadowMap.type = THREE.PCFSoftShadowMap;
|
||||||
|
|||||||
@@ -226,7 +226,7 @@ export class CesiumGlobe {
|
|||||||
scene.globe.maximumScreenSpaceError = 2.0; // 默认细分,最省性能
|
scene.globe.maximumScreenSpaceError = 2.0; // 默认细分,最省性能
|
||||||
scene.globe.tileCacheSize = 600; // 更大的瓦片缓存,减少细节刷新
|
scene.globe.tileCacheSize = 600; // 更大的瓦片缓存,减少细节刷新
|
||||||
scene.fxaa = false; // 关闭抗锯齿后处理,省一个全屏通道
|
scene.fxaa = false; // 关闭抗锯齿后处理,省一个全屏通道
|
||||||
viewer.resolutionScale = 1.5; // 1.5 倍超采样,替代 FXAA 提供更锐利的抗锯齿
|
viewer.resolutionScale = 1.0; // 关闭超采样(DPR 已提供足够分辨率),省填充率
|
||||||
scene.maximumRenderTimeChange = Infinity; // 配合 requestRenderMode:静止时停止重绘,大幅省电省帧
|
scene.maximumRenderTimeChange = Infinity; // 配合 requestRenderMode:静止时停止重绘,大幅省电省帧
|
||||||
|
|
||||||
// 卫星影像
|
// 卫星影像
|
||||||
|
|||||||
+1
-1
@@ -234,7 +234,7 @@ function makeLeatherNormalMap() {
|
|||||||
|
|
||||||
// 内侧绒面法线:密集细绒毛(高频噪点)
|
// 内侧绒面法线:密集细绒毛(高频噪点)
|
||||||
function makeSuedeNormalMap() {
|
function makeSuedeNormalMap() {
|
||||||
const w = 1024, h = 1280;
|
const w = 512, h = 640; // 降分辨率省 75% 逐像素计算,视觉几乎无差
|
||||||
const c = document.createElement('canvas');
|
const c = document.createElement('canvas');
|
||||||
c.width = w; c.height = h;
|
c.width = w; c.height = h;
|
||||||
const ctx = c.getContext('2d', { willReadFrequently: true });
|
const ctx = c.getContext('2d', { willReadFrequently: true });
|
||||||
|
|||||||
+1
-1
@@ -1,7 +1,7 @@
|
|||||||
import * as THREE from 'three';
|
import * as THREE from 'three';
|
||||||
|
|
||||||
// 超采样倍数:文字以更高分辨率栅格化,拉近/放大后依然清晰
|
// 超采样倍数:文字以更高分辨率栅格化,拉近/放大后依然清晰
|
||||||
const SS = 4;
|
const SS = 2;
|
||||||
|
|
||||||
// 折行:尽量均分两行(标题较短),均分不满足时逐字折行
|
// 折行:尽量均分两行(标题较短),均分不满足时逐字折行
|
||||||
function wrapText(ctx, text, maxW) {
|
function wrapText(ctx, text, maxW) {
|
||||||
|
|||||||
Reference in New Issue
Block a user