Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

Fast Graphics Performance With HTML

  • Make content that has scrolling content underneath it opaque

    • e.g. use
      <div><div style="background:white; position:fixed">Simple</div>lots of text...</div>
      instead of
      <div><div style="position:fixed">Simple</div>lots of text...</div>
  • Make the content of scrollable sub frames opaque

    • e.g. use
      <div style="overflow:scroll><div style="background:white"><p>This is some text</p><p>And some more</p></div></div>
      instead of
      <div style="overflow:scroll><p>This is some text</p><p>And some more</p></div>
  • Animating 'transform' and 'opacity' properties can be done with the compositor which makes them efficient to animate

Document Tags and Contributors

 Contributors to this page: jrmuizel, bgirard
 Last updated by: jrmuizel,