5 Replies - 304 Views - Last Post: 20 November 2017 - 07:51 AM

#1 Rixterz  Icon User is offline

  • D.I.C Head

Reputation: -4
  • View blog
  • Posts: 149
  • Joined: 26-August 12

Extremely slow window resizing with Grid

Posted 17 November 2017 - 05:23 PM

Hi

I recently rewrote my webpage with display: grid and such but I noticed the page is horribly slow at resizing. I've made sure no javascript is running in the background. There are only about 20 rows and the columns are set at 8% auto 8%.

Also when I call .html() on an element in the grid, there's horrible lag whilst it updates. Before grid I could run this in a loop 100 times and it would perform perfectly smoothly. It seems all animations requiring the movement of elements causes lag.

Does anyone know why this might be and how to fix it?

Is This A Good Question/Topic? 0
  • +

Replies To: Extremely slow window resizing with Grid

#2 Martyr2  Icon User is offline

  • Programming Theoretician
  • member icon

Reputation: 5121
  • View blog
  • Posts: 13,790
  • Joined: 18-April 07

Re: Extremely slow window resizing with Grid

Posted 17 November 2017 - 05:42 PM

Have you tried using a different browser? Do you see the same amount of lag across all browsers? Sounds like a rendering / painting issue which is in the browser itself. If you use a different browser you use a different engine. If you find it better in another browser it might be a case of finding out how the page is actually being rendered/painted and see if that can be improved.

While you are at that, do you happen to have a decent video card?
Was This Post Helpful? 1
  • +
  • -

#3 Rixterz  Icon User is offline

  • D.I.C Head

Reputation: -4
  • View blog
  • Posts: 149
  • Joined: 26-August 12

Re: Extremely slow window resizing with Grid

Posted 17 November 2017 - 05:46 PM

The same issue happens with Firefox.

My graphics card is decent, everything worked fine until Grid was introduced. Before I was using ugly floats and margins

This post has been edited by Rixterz: 17 November 2017 - 05:51 PM

Was This Post Helpful? 0
  • +
  • -

#4 andrewsw  Icon User is offline

  • blow up my boots
  • member icon

Reputation: 6444
  • View blog
  • Posts: 26,066
  • Joined: 12-December 12

Re: Extremely slow window resizing with Grid

Posted 17 November 2017 - 11:50 PM

If there is no Javascript involved then I would first validate the HTML (and CSS), if you haven't already done so. If HTML is malformed then browsers struggle to render, which resizing can highlight.

Also confirm the browser support, caniuse.
Was This Post Helpful? 1
  • +
  • -

#5 Rixterz  Icon User is offline

  • D.I.C Head

Reputation: -4
  • View blog
  • Posts: 149
  • Joined: 26-August 12

Re: Extremely slow window resizing with Grid

Posted 18 November 2017 - 06:11 AM

View Postandrewsw, on 18 November 2017 - 06:50 AM, said:

If there is no Javascript involved then I would first validate the HTML (and CSS), if you haven't already done so. If HTML is malformed then browsers struggle to render, which resizing can highlight.

Also confirm the browser support, caniuse.


The only things the validator said were wrong is that I didn't declare encoding or language, and that my <img> tags didn't have alt attributes.

The browser is updated and supports Grid

This post has been edited by Rixterz: 18 November 2017 - 06:13 AM

Was This Post Helpful? 0
  • +
  • -

#6 Rixterz  Icon User is offline

  • D.I.C Head

Reputation: -4
  • View blog
  • Posts: 149
  • Joined: 26-August 12

Re: Extremely slow window resizing with Grid

Posted 20 November 2017 - 07:51 AM

Turns out the outermost grid was causing the issues. When I removed it, the lag went away entirely. Strange, because the inner grids have grids inside them

This post has been edited by andrewsw: 20 November 2017 - 09:24 AM
Reason for edit:: Removed previous quote, just press REPLY

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1