- This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
Viewing 4 posts - 1 through 4 (of 4 total)
- The forum ‘JavaScript’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Home › Forums › JavaScript › Functions collections or loose functions?
Hello.
Recently, I wanted to achieve some better and more easily explainable code for my projects in JavaScript. I started to accumulate functions in collections and then firing them either on $(document).ready
, $(window).load
or $(window).scroll
.
To illustrate, I’ve created an example on CodePen.
My problem is – which is better when performance (mobile especially) comes into play? First option weights more (around 1-2KB, but still, after minifying less than 1KB).
I think it really depends on what you’re trying to build. If it makes sense to group functions together (maybe they all relate to the same functionality of a page) then go ahead and do that.
One note, though, I really dislike just doing:
function looseFunc1() { }
I prefer at a minimum doing:
var looseFunc1 = function () {
};
More info on why here: https://github.com/shichuan/javascript-patterns/blob/master/general-patterns/function-declarations.html
Also, regarding the 1-2KB thing. There are going to be other things on the page that can be optimized way more than that, I’m sure. Simply optimizing an image gives you way more than 1-2KB to play with.
Thanks for your opinion.
I tend to go with collections mostly because I can – like you said – group functions into chunks (similar to what I’m doing with SASS – creating various _something.scss
files and then include them in my main sheet) like Animations
, globalFunctions
etc.
Also, great read with those patterns. I never knew that function whatever()
is wrong :)