[solved]My project crash in my mobile page! cpu over100%

Questions
1

If someone can help me I will be grateful!

there is my project demo URL : DEMO

2

The CSS class .x-sign and the corresponding CSS animation seem to produce signification overhead. Can you please remove theone.className='ele x-sign'; in your code and make a test?

3

Thanks for helpful friends!
Receive your suggestion,i will test this right now!

4

but it always crashed when the ‘START’ btn onclick in my iphone 6 plus.

5

Does your app also crash without animations? I mean if you just show the images after clicking on the start button.

6

yes!
I guess it’s caused by a lot of element rendering, but I don’t know how to optimize it

7

Um, your app does not crash on my Pixel. I guess you have to simplify your scene and remove some of your images.

BTW: What about this example. Does it run on your iPhone?

https://threejs.org/examples/css3d_periodictable.html

8

I know what you mean. i can open the example and Smooth running.

9

1:the element of the example is less than my app.
2: i used images in each element may case bad performance?
but My goal is to create an image-forming logo, just like a particle effect

10

You can try to create you scene with WebGLRenderer instead. This will provide much better performance than CSS3DRenderer.

11

Thanks again, I also tried the way you said, but some of the code I may be writing is wrong, especially how to put online pictures on each element. can you show me a example code?

12

Something like that? https://jsfiddle.net/f2Lommf5/2833/

1 Like
13

Thank you for your great help!
I will refactor my code this way.:grin: