Commit cba2e6b90b50c208e3354d4561b40576a251c370

Authored by 648540858
1 parent d3e815bf

优化wasm播放器内存占用问题

web_src/src/components/common/jessibuca.vue
... ... @@ -23,11 +23,11 @@
23 23 </template>
24 24  
25 25 <script>
  26 +let jessibuca = null;
26 27 export default {
27 28 name: 'jessibuca',
28 29 data() {
29 30 return {
30   - jessibuca: null,
31 31 playing: false,
32 32 isNotMute: false,
33 33 quieting: false,
... ... @@ -88,7 +88,7 @@ export default {
88 88 let options = {};
89 89 console.log("hasAudio " + this.hasAudio)
90 90  
91   - this.jessibuca = new window.Jessibuca(Object.assign(
  91 + jessibuca = new window.Jessibuca(Object.assign(
92 92 {
93 93 container: this.$refs.container,
94 94 videoBuffer: 0.2, // 最大缓冲时长,单位秒
... ... @@ -119,68 +119,68 @@ export default {
119 119 ));
120 120  
121 121 let _this = this;
122   - this.jessibuca.on("load", function () {
  122 + jessibuca.on("load", function () {
123 123 console.log("on load init");
124 124 });
125 125  
126   - this.jessibuca.on("log", function (msg) {
  126 + jessibuca.on("log", function (msg) {
127 127 console.log("on log", msg);
128 128 });
129   - this.jessibuca.on("record", function (msg) {
  129 + jessibuca.on("record", function (msg) {
130 130 console.log("on record:", msg);
131 131 });
132   - this.jessibuca.on("pause", function () {
  132 + jessibuca.on("pause", function () {
133 133 _this.playing = false;
134 134 });
135   - this.jessibuca.on("play", function () {
  135 + jessibuca.on("play", function () {
136 136 _this.playing = true;
137 137 });
138   - this.jessibuca.on("fullscreen", function (msg) {
  138 + jessibuca.on("fullscreen", function (msg) {
139 139 console.log("on fullscreen", msg);
140 140 _this.fullscreen = msg
141 141 });
142 142  
143   - this.jessibuca.on("mute", function (msg) {
  143 + jessibuca.on("mute", function (msg) {
144 144 console.log("on mute", msg);
145 145 _this.isNotMute = !msg;
146 146 });
147   - this.jessibuca.on("audioInfo", function (msg) {
  147 + jessibuca.on("audioInfo", function (msg) {
148 148 // console.log("audioInfo", msg);
149 149 });
150 150  
151   - this.jessibuca.on("videoInfo", function (msg) {
  151 + jessibuca.on("videoInfo", function (msg) {
152 152 // this.videoInfo = msg;
153 153 console.log("videoInfo", msg);
154 154  
155 155 });
156 156  
157   - this.jessibuca.on("bps", function (bps) {
  157 + jessibuca.on("bps", function (bps) {
158 158 // console.log('bps', bps);
159 159  
160 160 });
161 161 let _ts = 0;
162   - this.jessibuca.on("timeUpdate", function (ts) {
  162 + jessibuca.on("timeUpdate", function (ts) {
163 163 // console.log('timeUpdate,old,new,timestamp', _ts, ts, ts - _ts);
164 164 _ts = ts;
165 165 });
166 166  
167   - this.jessibuca.on("videoInfo", function (info) {
  167 + jessibuca.on("videoInfo", function (info) {
168 168 console.log("videoInfo", info);
169 169 });
170 170  
171   - this.jessibuca.on("error", function (error) {
  171 + jessibuca.on("error", function (error) {
172 172 console.log("error", error);
173 173 });
174 174  
175   - this.jessibuca.on("timeout", function () {
  175 + jessibuca.on("timeout", function () {
176 176 console.log("timeout");
177 177 });
178 178  
179   - this.jessibuca.on('start', function () {
  179 + jessibuca.on('start', function () {
180 180 console.log('start');
181 181 })
182 182  
183   - this.jessibuca.on("performance", function (performance) {
  183 + jessibuca.on("performance", function (performance) {
184 184 let show = "卡顿";
185 185 if (performance === 2) {
186 186 show = "非常流畅";
... ... @@ -189,25 +189,25 @@ export default {
189 189 }
190 190 _this.performance = show;
191 191 });
192   - this.jessibuca.on('buffer', function (buffer) {
  192 + jessibuca.on('buffer', function (buffer) {
193 193 // console.log('buffer', buffer);
194 194 })
195 195  
196   - this.jessibuca.on('stats', function (stats) {
  196 + jessibuca.on('stats', function (stats) {
197 197 // console.log('stats', stats);
198 198 })
199 199  
200   - this.jessibuca.on('kBps', function (kBps) {
  200 + jessibuca.on('kBps', function (kBps) {
201 201 _this.kBps = Math.round(kBps);
202 202 });
203 203  
204 204 // 显示时间戳 PTS
205   - this.jessibuca.on('videoFrame', function () {
  205 + jessibuca.on('videoFrame', function () {
206 206  
207 207 })
208 208  
209 209 //
210   - this.jessibuca.on('metadata', function () {
  210 + jessibuca.on('metadata', function () {
211 211  
212 212 });
213 213 },
... ... @@ -216,40 +216,40 @@ export default {
216 216 },
217 217 play: function (url) {
218 218 console.log(url)
219   - if (this.jessibuca) {
  219 + if (jessibuca) {
220 220 this.destroy();
221 221 }
222 222 this.create();
223   - this.jessibuca.on("play", () => {
  223 + jessibuca.on("play", () => {
224 224 this.playing = true;
225 225 this.loaded = true;
226   - this.quieting = this.jessibuca.quieting;
  226 + this.quieting = jessibuca.quieting;
227 227 });
228   - if (this.jessibuca.hasLoaded()) {
229   - this.jessibuca.play(url);
  228 + if (jessibuca.hasLoaded()) {
  229 + jessibuca.play(url);
230 230 } else {
231   - this.jessibuca.on("load", () => {
  231 + jessibuca.on("load", () => {
232 232 console.log("load 播放")
233   - this.jessibuca.play(url);
  233 + jessibuca.play(url);
234 234 });
235 235 }
236 236 },
237 237 pause: function () {
238   - if (this.jessibuca) {
239   - this.jessibuca.pause();
  238 + if (jessibuca) {
  239 + jessibuca.pause();
240 240 }
241 241 this.playing = false;
242 242 this.err = "";
243 243 this.performance = "";
244 244 },
245 245 destroy: function () {
246   - if (this.jessibuca) {
247   - this.jessibuca.destroy();
  246 + if (jessibuca) {
  247 + jessibuca.destroy();
248 248 }
249 249 if (document.getElementById("buttonsBox") == null) {
250 250 this.$refs.container.appendChild(this.btnDom)
251 251 }
252   - this.jessibuca = null;
  252 + jessibuca = null;
253 253 this.playing = false;
254 254 this.err = "";
255 255 this.performance = "";
... ... @@ -262,7 +262,7 @@ export default {
262 262 },
263 263 fullscreenSwich: function () {
264 264 let isFull = this.isFullscreen()
265   - this.jessibuca.setFullscreen(!isFull)
  265 + jessibuca.setFullscreen(!isFull)
266 266 this.fullscreen = !isFull;
267 267 },
268 268 isFullscreen: function () {
... ... @@ -273,8 +273,8 @@ export default {
273 273 }
274 274 },
275 275 destroyed() {
276   - if (this.jessibuca) {
277   - this.jessibuca.destroy();
  276 + if (jessibuca) {
  277 + jessibuca.destroy();
278 278 }
279 279 this.playing = false;
280 280 this.loaded = false;
... ...