# 缓存
通过本地缓存（LocalCache）可以将纹理、模型、文件的资源存储到浏览器的IndexedDB中，用以提升资源加载速度。
# 连接缓存
使用LocalCache的connect静态接口连接本地缓存。
提示
1.缓存必须先连接，然后才可以使用；
2.由于连接操作是异步的，所以为了确保可以正常读写缓存，推荐在缓存连接成功后再初始化三维场景。
import {
AmbientLight,
DirectionalLight,
Engine,
GridHelper,
LocalCache,
OrbitControl
} from '@tx3d/core';
// 连接缓存
LocalCache.connect().then( () => {
// 构建引擎
const engine = new Engine( {
// 场景渲染器参数
sceneRenderer: {
viewport: document.getElementById( 'viewport' ), // 渲染视口
antialias: true, // 开启反走样
clearColor: '#002233' // 背景颜色
},
} );
// 创建场景实体
const scene = engine.createScene();
// 为场景添加一个环境光组件
scene.addComponent( AmbientLight, {
color: '#ffffff',
intensity: 0.25
} );
// 为场景添加一个方向光组件
scene.addComponent( DirectionalLight, {
position: [ 100, 100, 100 ],
color: '#ffffff',
intensity: 1.0
} );
// 设置激活场景
engine.setActiveScene( scene );
// 创建相机实体
const camera = engine.createCamera( {
name: 'main_camera',
camera: {
position: [ 0.0, 500.0, 0.0 ]
}
} );
// 添加OrbitControl组件
camera.addComponent( OrbitControl, { enableDamping: true } );
// 设置激活相机
engine.setActiveCamera( camera );
// 创建一个空实体
const entity = engine.createEntity();
// 添加一个网格助手
entity.addComponent( GridHelper, { color: '#ffffff' } );
}, ( error ) => {
// TODO:连接失败提示
} );
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
# 关闭缓存
使用LocalCache的close静态接口关闭缓存。
import { LocalCache } from '@tx3d/core';
// 关闭缓存
LocalCache.close();
1
2
3
4
2
3
4
注意
缓存关闭后，需要重新连接才能使用！
# 删除缓存
1️⃣ 使用LocalCache的deleteCache静态接口删除缓存。
import { LocalCache } from '@tx3d/core';
// 删除缓存
LocalCache.deleteCache();
1
2
3
4
5
2
3
4
5
2️⃣ 通过浏览器的 "开发者工具"->"应用" 手动删除缓存，如下图所示：
注意
缓存删除后，需要重新连接才能使用！
# 添加一条缓存记录
使用LocalCache的add静态接口添加一条缓存记录。
import { LocalCache } from '@tx3d/core';
// 添加一条缓存记录
LocalCache.add( './assets/jsons/test.json', jsonData ).then( () => {
// TODO:添加成功回调
}, ( error ) => {
// TODO:添加失败回调
} );
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
提示
无特殊需求，外部勿主动调用该接口！
# 获取一条缓存记录
使用LocalCache的get静态接口获取一条缓存记录。
import { LocalCache } from '@tx3d/core';
// 获取一条缓存记录
LocalCache.get( './assets/textures/a.png' ).then( ( data ) => {
// TODO:获取成功回调
}, ( error ) => {
// TODO:获取失败回调
} );
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
提示
无特殊需求，外部勿主动调用该接口！
# 删除一条缓存记录
1️⃣ 使用LocalCache的delete静态接口移除一条缓存记录。
import { LocalCache } from '@tx3d/core';
// 删除一条缓存记录
LocalCache.delete( './assets/textures/a.png' ).then( () => {
// TODO:删除成功回调
}, ( error ) => {
// TODO:删除失败回调
} );
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
提示
无特殊需求，外部勿主动调用该接口！
2️⃣ 通过浏览器的 "开发者工具"->"应用" 手动删除一条缓存记录，如下图所示：
# 删除所有缓存记录
1️⃣ 使用LocalCache的clear静态接口清空所有缓存记录。
import { LocalCache } from '@tx3d/core';
// 删除所有缓存记录
LocalCache.clear();
1
2
3
4
2
3
4
2️⃣ 通过浏览器的 "开发者工具"->"应用" 手动删除所有缓存记录，如下图所示：
