关于提高webgame地图加载速度技术解决方案

admin管理员组

文章数量:1531265

2023年12月16日发(作者：)

关于提高加载速度技术解决方案

1、 将包含多个子文件的Flash分解成A、B、C等多个小文件加载

A、 导航拆成一级导航和二级地图导航

B、 场景边框和聊天菜单分开加载

C、 场景内一些元素作为情景物品分层加载，如树木、云朵、小动画

2、 将大场景进行分割，分段加载。如旺铺街，如果以后店铺数目过多时应分成几段加载，此方法的缺点是人物行走感官上出现不连贯

3、 永久缓存

浏览器具有缓存功能，可以把Web应用的一部分保存在内存当中。这样，同一Web应用的不同的浏览器页面就可以共享内存中的内容，而不必从服务器端多次下载这些相同的内容。但随着浏览器窗口的关闭而被清除。因此，我们也可以称浏览器缓存为临时缓存。当你下次访问相同Web应用的时候，你仍然需要下载曾经的缓存内容。

Flex3提供了永久缓存的功能：通过在编译Flex程序的时候把Flex Framework和程序的公共部分指定为RSL（Runtime Shared Library），就能够达到永久缓存的效果。

此方法需要研究FlashPlayer的内部机制。

4、 服务器硬件扩展

提高本身服务器的硬件资源和带宽资源，以解决高用户的请求

5、 改善加载进度条的友好程度，改善加载上的时间体验

6、 开启硬件加速，最新的FlashPlayer已经支持硬件加速功能，但是支持GPU计算开启硬件加速的机器仍不是主流，可在帮助中提示用户可以开启硬件加速

7、 过滤不需要的功能

8、 研发浏览器插件，使用C++等语言进行专属插件，工作量较大

9、 flash地图图片分块加载

将地图场景进行程序上的分块，片要在可见区域里需要显示它的时候，才加载，实现分批加载。

本方法需要对程序进行大幅改动，需在二期时执行

附：解决方法例子

图首先我们确定几个关键点：

窗口大小：windowW:Number,windowH:Number; 指的是可视区域的大小 我们可以把他想成客户端的分别率

单位地图大小： uintPicW：Number，uintPicH：Number; 指的是你切割的地图图片的单元大小。

当前地图坐标：position：point;这里大家就可以想成是你人物的当前所处坐标

我们可以很容易的求出窗口的4个点，所占的地图的索引：

x0 = position.x - windowW/2;

x1 = position.x + windowW/2;

y0 = position.y - windowH/2;

y1 = position.y + windowH/2;

mapIndexX0 = uint(x0/256);

mapIndexX1 = uint(x1/256);

mapIndexY0 = uint(y0/256);

mapIndexY1 = uint(y1/256);

源码:

1.

2.

3.

4.

5.

6.

7.

8.

9.

package

{

import ;

import splayObject;

import p;

import ishGC;

import oader;

import p;

10.

11. import ;

12. import ;

13. import rEvent;

14. import ssEvent;

15. import ;

16. //地图层 图片

17. public class MapLayer extends BaseDisplayObject

18. {

19. //图片读取器

20. private var _imageLoader:ImageLoader;

21. //地图图片 用于整块加载模式

22. private var _image:Bitmap;

23. //地图图片数组 用于栅格式加载地图模式

24. private var _imageMap:HashMap;

25. //小地图图片

26. private var _simage:Bitmap;

27. //

28. private var _map:GameMap;

29. private var _loadType:int;//加载类型 0：整块加载 1：栅格加载

30. private var _visualWidth:Number;//地图可视宽度

31. private var _visualHeight:Number;//地图可视高度

32. private var _sliceWidth:Number;//地图切割单元宽度

33. private var _sliceHeight:Number;//地图切割单元高度

34. private var _preloadX:Number;//横向预加载屏数

35. private var _preloadY:Number;//纵向预加载屏数

36. private var _loadingMap:HashMap;//正在加载的屏map

37. private var _waitLoadingArr:Array;//等待加载的loadermap

38.

39. private var _loadingNo:int = ("concurrencyImageLoader");

40.

41. private var _screenImageRow:int;//一屏需要加载的横向图片数

42. private var _screenImageCol:int;//一屏需要加载的纵向图片数

43. private var _row:int;//总横向节点数

44. private var _col:int;//总纵向节点数

45.

46. private var _nowPlayerPointoint;//当前人物所处的屏

47.

48. public function MapLayer(map:GameMap)

49. {

50. _map = map;

51. _loadType = parseInt(_.@loadType);

52. }

53. //读取地图图片

54. public function load():void{

55. //加载小地图

56. var imageLoader:ImageLoader = new ImageLoader();

57. var fileName:String =ue("mapLib") + _ + "/map_";

58. (fileName);

59. ntListener(TE,loadSmallSuccess);

60. ntListener(SS,loadingHandler);

61. ntListener(_ERROR,ioErrorHandler);

62.

63. }

64. //读取大地图成功

65. private function loadBigSuccess(evet:Event):void{

66. var imageLoader:ImageLoader = ImageLoader();

67. var image:Bitmap = new Bitmap(imageLoader._data);

68. addChild(image);

69. if(_simage != null && _ == this){

70. removeChild(_simage);

71. _simage = null;

72. }

73. = ;

74. = ;

75. EventListener(TE,loadBigSuccess);

76. EventListener(SS,loadingHandler);

77. EventListener(_ERROR,ioErrorHandler);

78. imageLoader = null;

79. dispatchEvent(evet);

80. ();

81. }

82. //读取小地图成功

83. private function loadSmallSuccess(evet:Event):void{

84. var imageLoader:ImageLoader = ImageLoader();

85. var image:Bitmap = new Bitmap(imageLoader._data);

86. = _th;

87. = _ght;

88. addChild(image);

89. = ;

90. = ;

91. EventListener(TE,loadSmallSuccess);

92. EventListener(SS,loadingHandler);

93. EventListener(_ERROR,ioErrorHandler);

94. imageLoader = null;

95. dispatchEvent(evet);

96. ();

97. switch(_loadType){

98. case 0://整块加载

99. //加载大地图

100. var bfileName:String =ue("mapLib") + _ + "/";

101. var bLoader:ImageLoader = new ImageLoader();

102. (bfileName);

103. ntListener(TE,loadBigSuccess);

104. ntListener(SS,loadingHandler);

105. ntListener(_ERROR,ioErrorHandler);

106. break;

107. case 1:

108. _loadingMap = new HashMap();

109. _imageMap = new HashMap();

110. _waitLoadingArr = new Array();

111. _visualWidth = _.x;

112. _visualHeight = _.y;

113. _sliceWidth = parseFloat(_.@sliceWidth);

114. _sliceHeight = parseFloat(_.@sliceHeight);

115. _preloadX = parseFloat(_.@preloadX);

116. _preloadY = parseFloat(_.@preloadY);

117. _screenImageRow = (_visualWidth/_sliceWidth);

118. _screenImageCol = (_visualHeight/_sliceHeight);

119. _row = (_th/_sliceWidth);

120. _col = (_ght/_sliceHeight);

121. loadSliceImage(_ayerPoint);

122. break;

123. default:

124. break;

125.

126. }

127. }

128.

129. //根据player坐标读取周边指定屏数地图

130. private function loadSliceImage(playerPointoint):void{

131. var nowX:int = (playerPoint.x/_sliceWidth);//现在所处的索引X

132. var nowY:int = (playerPoint.y/_sliceHeight);//现在所处的索引Y

133. var nowScreenX:int = (nowX/_screenImageRow);//现在所处的屏索引X

134. var nowScreenY:int = (nowY/_screenImageCol);//现在所处的屏索引Y

135. // trace("nowScreenX:" + nowScreenX);

136. // trace("nowScreenY:" + nowScreenY);

137. _nowPlayerPoint = new Point(nowScreenX,nowScreenY);

138. loadScreenImage(nowScreenX,nowScreenY);

139. // removeScreenImage(nowScreenX,nowScreenY);

140. var startX:int = (nowScreenX - _preloadX < 0 ? 0 : nowScreenX - _preloadX);

141. var startY:int = (nowScreenY - _preloadY < 0 ? 0 : nowScreenY - _preloadY);

142.

143. var endX:int = (nowScreenX + _preloadX > _row ? _row : nowScreenX + _preloadX);

144. var endY:int = (nowScreenY + _preloadY > _col ? _col : nowScreenY + _preloadY);

145.

146. for(var xx:int = startX; xx < endX;xx++){

147. for(var yy:int = startY; yy < endY;yy++){

148. if(xx == nowScreenX && yy == nowScreenY){

149. continue;

150. }else{

151. loadScreenImage(xx,yy);

152. }

153. }

154. }

155. }

156. //加载指定屏的地图图片

157. private function loadScreenImage(screenX:int,screenY:int):void{

158. var starX:int = _screenImageRow*screenX < 0 ? 0 : _screenImageRow*screenX;

159. var starY:int = _screenImageCol*screenY < 0 ? 0 : _screenImageCol*screenY;

160. var endX:int = _screenImageRow*(screenX+1) > _row - 1 ? _row -1 :

_screenImageRow*(screenX+1);

161. var endY:int = _screenImageCol*(screenY+1) > _col-1 ? _col-1 :

_screenImageCol*(screenY+1);

162. for(var yy:int=starY;yy

163. for(var xx:int = starX;xx

164. var tempKey:String = yy+"_"+xx;

165. if(!_nsValue(tempKey)

&& !_nsKey(tempKey)){

166. _(tempKey);

167. }

168. }

169. _e();

170. loadImage();

171. }

172. }

173.

174. private function loadImage():void{

175. if(_ > 0){

176. for(var i:int = 0;i<_loadingNo - _();i++){

177. var key:String = _();

178. var imageLoader:ImageLoader = new ImageLoader();

179. var fileName:String = ue("mapLib") + _ +"/" + key +

".jpg";

180. // trace("fileName:" + fileName);

181. _(imageLoader,key);

182. ntListener(TE,loadScreenImageSuccess);

183. ntListener(SS,loadingHandler);

184. ntListener(_ERROR,ioErrorHandler);

185. (fileName);

186. }

187. }

188. }

189.

190. //成功加载某屏的图片

191. private function loadScreenImageSuccess(evet:Event):void{

192. var imageLoader:ImageLoader = ImageLoader();

193. var tempStr:String = String(_ue(imageLoader));

194. var tempStrArr:Array = ("_");

195. var yy:int = tempStrArr[0];

196. var xx:int = tempStrArr[1];

197. _(imageLoader);

198. var image:Bitmap = new Bitmap(imageLoader._data);

199. image.x = _sliceWidth*xx;

200. image.y = _sliceHeight*yy;

201. ld(image);

202. _(yy+"_"+xx,image);

203. EventListener(TE,loadScreenImageSuccess);

204. EventListener(SS,loadingHandler);

205. EventListener(_ERROR,ioErrorHandler);

206. imageLoader = null;

207. loadImage();

208. }

209. //卸载指定屏的地图图片

210. private function removeScreenImage(screenX:int,screenY:int):void{

211. var startX:int = (screenX - _preloadX < 0 ? 0 : screenX - _preloadX);

212. var startY:int = (screenY - _preloadY < 0 ? 0 : screenY - _preloadY);

213.

214. var endX:int = (screenX + _preloadX > _row ? _row : screenX + _preloadX);

215. var endY:int = (screenY + _preloadY > _col ? _col : screenY + _preloadY);

216. var keyArr:Array = _();

217. for(var i:int = 0;i < ;i++){

218. var key:String = keyArr;

219. var tempStrArr:Array = ("_");

220. var yy:int = tempStrArr[0];

221. var xx:int = tempStrArr[1];

222. if(xx < startX*_screenImageRow || xx > endX * _screenImageRow || yy <

startY*_screenImageCol || yy > endY*_screenImageCol){

223. var image:Bitmap = Bitmap(_ue(key));

224. Child(image);

225. image = null;

226. _(key);

227. }

228. }

229. ();

230. }

231.

232. //检查是否需要加载

233. public function checkLoad(pointoint):void{

234. var nowX:int = (point.x/_sliceWidth);//现在所处的索引X

235. var nowY:int = (point.y/_sliceHeight);//现在所处的索引Y

236. var nowScreenX:int = (nowX/_screenImageRow);//现在所处的屏索引X

237. var nowScreenY:int = (nowY/_screenImageCol);//现在所处的屏索引Y

238. if(nowScreenX != _nowPlayerPoint.x || nowScreenY != _nowPlayerPoint.y){

239. loadSliceImage(point);

240. }

241.

242. }

243.

本文标签： 加载地图需要