8

I am working on an AngularJs project which is getting bigger very fast.

Currently I need to store some user data, so I was using $localStorage for Angular.

But I had a problem, as the application is saving a big amount of data, it is hanging the browser some seconds which is very annoying.

Searching for asynchronous uses of localStorage I've found a bunch of people saying that it not possible to use it. But I managed to found some plain javascript implementations on GitHub:

There is an Angular implementation which is based on what Mozilla provides, but the build is failing and I want to use something more stable due to the importance of the project.

Then I came to this doubt, how should I use plain/vanilla javascript inside an Angular app?

I know that it is discouraged to use jQuery in the way people normally are "tempted" to use. How should I organize my pure javascript libraries in my application in a way that I can still see it very organized and fitting in the "Angular Way"?

EDIT: I know I have given you a fairly specific example about my data storage problem and some people might want help me with this, I really appreciate that (seriously). But unfortunately this is not the kind of answer I expect, since it does not have any relation with my real question. Please consider that even if I solve my data problem on my own, I will still want to know what are the best practices of including plain javascript code on my Angular Apps (that's the reason I've posted it here and not in StackOverflow). I could not find any good articles or questions here about it. I want the power of thinking of all great developers out there to help me, but most of all, help the community. I really think that good answers to this question could help a great amount of people, and that is what StackExchange is all about.

Improve this question
12
  • 1
    If localStorage is taking too long, then I'd safe offload most of the storage to the server, and limit localtStorage to a cache.
    – Greg Burghardt
    Commented Jul 9, 2015 at 20:53
  • The problem is that there a big client side object, which the view is based on. Basically we are building a dynamically created visualization from a given json file. The user can change the inputs the json has and we want to save all modifications the user might do to this data client side, before sending any data forward.
    – Patrick Bard
    Commented Jul 9, 2015 at 21:45
  • Consider using IndexedDB, it is meant for larger data-sizes and works asynchronously. Also note that LocalStorage has a, sometimes unknown max-limit, which is quite low.
    – wojjas
    Commented Jul 10, 2015 at 5:56
  • As far as I know, localForage is using IndexedDB inside (at least it gives me an error if I don't include indexeddb.js). But that was just the example I had to give to elaborate my real question, try to focus on answering that please.
    – Patrick Bard
    Commented Jul 10, 2015 at 11:08
  • Sorry I'm still failing to understand what your "real question" is. Is it about how to organize large Angular projects in general? What do you mean is "including plain javascript code on my Angular Apps" Are your controllers not written in "plain javascript"?
    – wojjas
    Commented Jul 10, 2015 at 13:17

1 Answer 1

Reset to default
1

You might like Require.js. I don't believe there is a "standard Angular way" of importing code because they figure you'll use any of the other techniques:

  • Concatenate and minify using Bower
  • Import using regular script tags
  • Use a loading library like Require.js
  • Just define your own stuff as services in Angular

You also might want to read http://oblongmana.com/articles/angular-third-party-injection-pattern/ as it describes a pattern for Angularizing third party libraries, which are just plain old JavaScript.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.