1

I am developing a huge project. The project is a webshop where most of the things are dynamically. Because of this, I decided to use AngularJS as a framework and added the jQuery library.

However, after developing more than 3 months now. I see that i got alot of AngularJS code.

My angular structure is currently:

  • 34 controllers - All about 6kb in size (non-minified, I can still save some space there)*
  • 1 file with more then 21 angular services. - 11KB in size (non-minified)
  • 1 file with 44 custom angular filters - 24KB in size (non-minified)
  • 1 file with 32 custom angular directives - 18KB in size (non-minified)

On top of this i also use:

I did not list every AngularJS or jQuery / JavaScript library I included inside the project. That would get a pretty long list, which would be unnessecary.

*Not all controllers are loaded at once. Most controllers at one time is 5.
**When a word is misspelled it shows a word correction. Just like google.com. Also generates suggestions when a user searches for something and no results were found. It shows equivalent word suggestions that have results.

The project makes alot of AJAX calls using the $http service from AngularJS. Eg; auto complete in the search, pages, user information, basket data .. and much more.

The benefit of it in my eyes: 'It feels very smooth'. All data gets loaded within the same page if it is part of the same page.

For example:

The webshop articles are loaded on the page /assortment/. When searching, the search results are displayed on the same page, instead of redirecting to a /search/ page.

My question is:

Is using so much JavaScript a bad practice? Does this affect slower computers alot? or is the difference not noticable? Or do i have to improve the code, so it won't affect slower PC's?

I go to mention that I am not able to test it on different computers yet. So i do not know how it performs on other PC's.

I found 1 topic on SO with a similair question: What's the downside of using too much JavaScript?

But the question itself is more directing to; 'using libraries'

Cœur
  • 37,241
  • 25
  • 195
  • 267
Red
  • 6,599
  • 9
  • 43
  • 85
  • The files you listed are pretty small, and realize that most JS files, once loaded, are cached, and the browser will return a 302 when found in the cache, instead of 200 meaning it loaded from the server OK. So usually in an app, even if you have 1MB in script, it should get cached and thus you don't have a recurring network hit. – Brian Mains Aug 11 '17 at 14:35
  • This is *not* by any means what I would consider a "lot" of javascript. Seems quite light on js to me. – freedomn-m Aug 11 '17 at 14:35
  • Just a side note: be wary using jquery along side Angular. Remember angular has JQlite integrated anyway, and it can sometimes lead developers unfamiliar with the "angular way of doing things" to use it as a crutch – Anduril Aug 11 '17 at 14:35
  • Consider a "popular" (though whether good or not is left to the reader...) library such as Kendo UI is over 2Mb minified. – freedomn-m Aug 11 '17 at 14:36
  • Being concerned about not even 100kB non-minified in this day and age seems a bit odd. A random website i host shows half a dozen high resolution images on the front page which is absurdly more data than that. – ASDFGerte Aug 11 '17 at 14:36
  • @freemn-m Currently it is not as much indeed. But there will come alot more. – Red Aug 11 '17 at 14:37
  • *eyes own website with 300kb of javascript on intense page*. I wouldn't worry if I were you. – Tschallacka Aug 11 '17 at 14:37
  • @Red we can only go on the information provided - no-where in your question have you said that the amount of js will increase by an order of magnitude (eg 1000x more). (which makes listing any amount somewhat pointless). – freedomn-m Aug 11 '17 at 14:39
  • @ASDFGerte The totall amount in MB is currently 4.6MB. But i guess this still is not much these days. – Red Aug 11 '17 at 14:42
  • @Anduril Yes angular has jQlite, it will however use jQuery if available. jQuery has more functions to use than jQlite. But i need to digg into it to find out any pros and cons :) – Red Aug 11 '17 at 14:43
  • 1
    @Red I know it will, just a friendly message from someone that has travelled a similar road :-) There is very little that you need jquery for inside angular and modifying the DOM using jq outside the digest cycle can cause bugs and issues that can be tricky to track down – Anduril Aug 11 '17 at 15:03

1 Answers1

6

It's 2017. There is no such thing as too much JavaScript. Maybe if someone is trying to access your site from a device that came out in the early 2000s, then they should rather get a new device.

We have the technology, so let's use it.

JackDev
  • 4,891
  • 1
  • 39
  • 48
  • Yes, i though the same things. Wanted to be sure. But seems like everyone agrees on this. Thanks for you awnser. – Red Aug 11 '17 at 14:41