search

jmpressjs / jmpress.js

A jQuery plugin to build a website on the infinite canvas
http://jmpressjs.github.com/jmpress.js
1.5k stars 237 forks source link

Transform Scale causing presention to lag in FireFox #149

Open dc-devs opened 10 years ago

dc-devs commented 10 years ago

Please see the presentation I have most recently built with jmpress here: http://www.displayadtech.com/the_display_advertising_technology_landscape

The transitions that use the Scale property are smooth in Chrome, Safari and Opera. However, are lagging when rendered in FireFox.

I know the typical FieFox browser renders with a slower FPS when the Hardware GPU is not being utilized, however, since this presentation is utilizing Transform3d CSS property I would assume that the hardware GPU would be kicked in and the presentation would render at a faster FPS rate. Am I wrong in assuming this?

At this point in time, is there anything I can do to tweak or change the transitions that use the transform Scale property to make the presentation render faster in FireFox?

Is there something else that I am missing that could be making this presentation render slow in FF besides the Transform Scale property?

Thanks again in advance for any help/advice. https://github.com/jmpressjs/jmpress.js/issues/new#preview_bucket_

sokra commented 10 years ago

Firefox seems to render all slides, while Chrome seems to render only visible slides. But chrome has a limit of rendered slides. You need to reduce the count of visible slides. Best way to do this would be to hide the explaination/definition slides until active. This would also improve the rendering issue with chrome.

You can do it with js or css your choice. Or you can use nested slides and some simple css.