simplefocus / FlowType.JS

Web typography at its finest: font-size and line-height based on element width.

Home Page:http://simplefocus.com/flowtype/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Throttle .resize()

saibayadon opened this issue · comments

I was about to do a PR for this but then i tought submitting an issue first might be a better idea.

What do you think about this? I think it's a good idea only to fire the resize function once every 300ms? I know that this is pretty fast, but you know... :shipit:

make it as an option

Bruno (and others), could you help me understand the benefit of have a resize throttle?

I guess the best explanation would be from http://benalman.com/projects/jquery-throttle-debounce-plugin/

In another example, the scroll event fires continuously in certain browsers, which means in those browsers, any bound event handler will execute (probably) far more often than you want it to. If your scroll handler is modifying the DOM or performing some other expensive computation, throttling it will guarantee that it executes far less frequently.

To put this in perspective, imagine a pretty content heavy site using this plugin. Now imagine that when you resize, the calculations run for each element everytime the window is resized. Take in account that depending on the browser the resize event can fire up to 20 times on a small resize, and 100 or more on larger resizes (for example when going to a "mobile" like view).

Either way on the demo (http://simplefocus.com/flowtype/demo.html) it feels pretty fast, but then again i'm using Chrome on a new iMac. That's why i agree with adding this as an option you can enable if you see performance hits on your site.

Good job anyways 🎉

+1 b kind to your ui threads

pretty simple to do, but I also don't see the need to throttle it...
demo