StarterSquad / ngseed

167 stars 48 forks source link

ngseed doesn't do lazy loading of controllers? #37

Open mpiasta-ca opened 9 years ago

mpiasta-ca commented 9 years ago

Finally got ngseed setup after hours of error handling. Once I was able to take a look at how it functions in a browser, I was disappointed that all the *.js files (controllers, services, etc) are concat into a single main.js file. Seems like the only files loaded dynamically/on demand are views, if I'm not mistaken?

This isn't the best solution for mobile web apps, because it forces the user to download the [almost] entire site on the first page load. This can take a really long time with a choppy mobile data connection. So time-to-first is too consuming.

As well, a large app can easily send the initial page load to over 1MB, which is a big download for mobile. An app I'm developing right now needs to have ~10 different sections, and it would be regular for a user to enter 3-4 sections before exiting. So that means there is a lot of code being loaded that is never used. As a mobile web app, we want to go as easy on the customer's mobile data plan as possible.

I came across a solution called AngularAMD, and that concept does use lazy loading for controllers and views. I was hoping that the ngseed was based around that concept, because ngseed had all the starting tools I was looking for -- including Gulp, Bower, routing, and sticking to the 'best practices for angular app structure'.

Maybe you can expand your project to include AngularAMD? Or why is it that your team chose to concat the module *.js into a single file, was there specific goals with doing that?

Maqsim commented 9 years ago

@mpiasta-ca First of all, thank you.

ngseed is older that AngularAMD, so we couldn't use it at start.

But I'm looking at AngularAMD now and it's seems quite strong tool I like it. We always thought about lazy-loading... I create a task for it, thanks

mpiasta-ca commented 9 years ago

Great, I think that will make this git repo one of the most popular angular seeds. Couple more suggestions I can make:

  1. Move the 6 testing files into a separate /test folder to keep the root dir cleaner.
  2. Remove gemfile.lock from the repo (it's automatically generated when running bundle install and not needed).
  3. In README.md, under E2E Tests add the instruction to start protractor server using webdriver-manager start (in a separate console).
  4. In README.md, move bower install up to Installation, because it's required before being able to run gulp.
  5. May want to drop nginx, since ngseed can technically be run as a front-end app without any back-end server (which is how we're using it, building an app that will connect to a separate API server that handles back-end). In my local build, I've switched it for 'gulp-connect', which is a standalone server that launches the app instantly in browser, and it has "live reload" that can be turned off/on. You can also take a look at 'browser-sync' which also launches a standalone server and has slightly more "live reload" features (but I don't like this one because there is no way to turn off "live reload", so when you are looking in Chrome/Network you see browser-sync files being injected, so during development it's harder to tell total load size and number of files being included).
  6. Might want to replace gulp-ruby-sass with gulp-sass to skip the whole need for users to install Ruby/Gem on their systems. Or at least include more detailed install instructions/links for new users because it was a pretty complicated process for Windows (took me ~45 minutes with troubleshooting, compared to other seeds which seemed to run gulp-sass out of the box). 1, 2, 3, 4, 5.
dmitryevseev commented 9 years ago
  1. Good catch,
  2. We're following this advice, 3,4. Yes, readme should be updated. Thank you for nagging :)
  3. That's correct, you're not tied to nginx and can use basically any webserver. That's another thing to be mentioned in the readme,
  4. We do use 2 gems in our styles setup - arkush, sass-globbing - that prevents from moving to gulp-sass.

I'll create Trello cards from your input to make sure that it won't get lost