Html5 Canvas is lagging after a couple clicks

Forum|Forum|2 years ago
March 31, 2023
1 reply
459 views

Hi, I'm new to adobe animate, I was using adobe flash around more than 10 years ago, and not really capable of programming. I'm creating a simple project and just using frames and go to frame scripts. After I published it, it works well, but only around a couple of clicks and then.... it become lagging and even stuck.
I have change the images into smaller resolution, also tried to minimize the simple animation, make the document size smaller, also change the fps but after I publish, it still happened just like that.

Is there any solution to this kind of problem? Really need help here.

Thank you in advance.

This topic has been closed for replies.

kglad

Community Expert

do you have any code in your project?

C

cleiffyAuthor

Participating Frequently

Hi, thanks for youjr reply... I'm using codes like this in every button, it's like telling every button to go to another frames manually.

This is an example of script for one button that I use:

var _this = this;
/*
Stop a Movie Clip/Video
Stops the specified movie clip or video.
*/
_this.stop();

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.button_2.on('click', function(){
/*
Moves the playhead to the specified frame number in the timeline and stops the movie.
Can be used on the main timeline or on movie clip timelines.
*/
_this.gotoAndStop(1);
});

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.button_3.on('click', function(){
/*
Moves the playhead to the specified frame number in the timeline and stops the movie.
Can be used on the main timeline or on movie clip timelines.
*/
_this.gotoAndStop(2);
});

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.button_4.on('click', function(){
/*
Moves the playhead to the specified frame number in the timeline and stops the movie.
Can be used on the main timeline or on movie clip timelines.
*/
_this.gotoAndStop(3);
});

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.button_5.on('click', function(){
/*
Moves the playhead to the specified frame number in the timeline and stops the movie.
Can be used on the main timeline or on movie clip timelines.
*/
_this.gotoAndStop(7);
});

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.button_7.on('click', function(){
/*
Moves the playhead to the specified frame number in the timeline and stops the movie.
Can be used on the main timeline or on movie clip timelines.
*/
_this.gotoAndStop(1);
});

var _this = this;
/*
Stop a Movie Clip/Video
Stops the specified movie clip or video.
*/
_this.homedrop_tablet.stop();
_this.homedrop_ampul.stop();
_this.homedrop_tanyajawab.stop();

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.button_1_dark.on('click', function(){
/*
Play a Movie Clip/Video or the current timeline.
Plays the specified movie clip or video.
*/
_this.homedrop_tablet.play();
_this.homedrop_ampul.play();
_this.homedrop_tanyajawab.play();

});

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.homedrop_tablet.on('click', function(){
/*
Moves the playhead to the specified frame number in the timeline and stops the movie.
Can be used on the main timeline or on movie clip timelines.
*/
_this.gotoAndStop(0);
});

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.homedrop_ampul.on('click', function(){
/*
Moves the playhead to the specified frame number in the timeline and stops the movie.
Can be used on the main timeline or on movie clip timelines.
*/
_this.gotoAndStop(8);
});

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.homedrop_tanyajawab.on('click', function(){
/*
Moves the playhead to the specified frame number in the timeline and stops the movie.
Can be used on the main timeline or on movie clip timelines.
*/
_this.gotoAndStop(16);
});

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.homedrop_tablet.on('click', function(){
/*
Moves the playhead to the specified frame number in the timeline and stops the movie.
Can be used on the main timeline or on movie clip timelines.
*/
_this.homedrop_tablet.gotoAndStop(0);
_this.homedrop_ampul.gotoAndStop(0);
_this.homedrop_tanyajawab.gotoAndStop(0);
});

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.homedrop_ampul.on('click', function(){
/*
Moves the playhead to the specified frame number in the timeline and stops the movie.
Can be used on the main timeline or on movie clip timelines.
*/
_this.homedrop_tablet.gotoAndStop(0);
_this.homedrop_ampul.gotoAndStop(0);
_this.homedrop_tanyajawab.gotoAndStop(0);
});

var _this = this;
/*
Clicking on the specified symbol instance executes a function.
*/
_this.homedrop_tanyajawab.on('click', function(){
/*
Moves the playhead to the specified frame number in the timeline and stops the movie.
Can be used on the main timeline or on movie clip timelines.
*/
_this.homedrop_tablet.gotoAndStop(0);
_this.homedrop_ampul.gotoAndStop(0);
_this.homedrop_tanyajawab.gotoAndStop(0);
});

kglad

Community Expert

Thanks a lot for the insights that I'm using same listeners multiple times.

I tried to minimize the same multiple listeners usage and it works smoothly and great now.

Again HUGE THANKS for the help !!!

you're welcome.

but i'm not sure what you mean by "minimize" the listeners usage. you don't need to minimize anything. you just need to prevent adding listeners more than once. in your situation, you would use:

if(!this.executed){

this.executed = true;

// and then all your code: