Echo JS 0.11.0

<~>

tracker1 comments

tracker1 1470 days ago. link 2 points
I'm not sure singleton is really useful for modern JS/TS.  I tend to just have a module with a declared export or set of exports for this use case.

An example is normalizing values either injected by the server or set via a request from the api or config server. As the first script.

ex: <script src="https://config-server/base.js"></script>

Then in-code, I use a module that normalizes the global variables the base.js sets. `global.__BASE__` which will include language strings, feature flags/toggles and any service urls.  I use feature/base.js from my code, that exposes the globals in a normalized patter... such as the current language and extra interfaces.

---

On observers, I tend to favor the simpler model that a node-style event emitter has.  For the DOM, you can subscribe and trigger non-standard events, though TS makes this difficult.

---

Factories are rarely needed in JS/TS, I tend to bucket them in with IoC and DI,

--- 

It's good to know the pattern, but the JS/TS platforms, language and tooling allows for simpler solutions in JS.  This is just my own opinion.
tracker1 1470 days ago. link 1 point
This is one of those borderline posts that I'm not always sure how to treat. Stripe, as a commercial service with this specific post being very close to an ad for the service, is off-topic for the site.  But since the series has been good, and it's an ongoing part of that, I'm letting it stand.
tracker1 1471 days ago. link 1 point
Should include a final working CSS version with the variable and usage shown... The article is okay, but stops just short or being complete/good.
tracker1 1471 days ago. link 2 points
It's nearly 70k minified... this is somewhat massive for the job at hand... 3/4 of that comes from the Velocity Animate library. It isn't *REALLY* vanilla js, it's a bundle built with webpack, and a rather large one at that.  I would suggest using a micro option[1] and/or straight CSS transitions. Animatelo comes in at 2.9k and is pretty feature rich.

Contrast a datepicker[2] that includes modal and date picker functionality, and includes preact in the bundle and comes in at 19k.

I know that 70k won't make or break a project... That said, it's mostly bloat.  Those looking for "vanilla js" would be better off going through the microjs site to look for libraries that fit their needs.  For that matter, devs should really consider trying to get site payloads back under 250k for JS, 100k for css, and heavily optimize for mobile images as well.  Libraries like this are why the typical webapp is now well over 2mb of JS content alone.

1. http://microjs.com/#animate
1. http://tracker1.github.io/md-datepicker/
tracker1 1475 days ago. link 2 points
For those using React+Redux, you might want to look at connected-react-router for a similar use case.
tracker1 1475 days ago. link 1 point
First, the example as posted uses the same quotes for all three.

Second, since you can't control for external factors like garbage collection, task schedulers etc. It's not really a good test unless run *many* times.

Third, after a pass through the language parser, they're all the same anyway...
tracker1 1475 days ago. link 2 points
Max for a 32-bit signed integer value, IIRC some browsers have/do allow for negative values... don't recall the behavior of any, as nobody really does this in practice.

Tip: ~~VALUE will always give you a 32bit signed integer value from the VALUE... 0 when it's not a clean conversion.  Don't use this for Date, since it will overflow and cut off the value.
tracker1 1475 days ago. link 1 point
SheetJS is pretty awesome, I would suggest loading the library async when needed, because it's kind of heavy from what I remember.
tracker1 1475 days ago. link 1 point
Should probably start with var statement, then expand on closures, and note that undeclared variables are assigned global by default, and historically the only closure in JS was inside a function. Then expand into const and let as closure based declarations.
[more]