Mostly agree... it tends to come down to managing state, validation, errors and submission as a whole, and rather than using bespoke code for each form using a library that combines these things in a cohesive way.
I'm usually using material-ui and redux, so there's those extra bits to wire in as well.
I'm not a fan of "list" posts in general, especially those that don't provide a method of selection, but the post and comments at least mention a variety of libraries for this, and being a react list it's at least a more narrow focus.
I don't, but a team at the company I work at is using a micro-ui architecture, not bit.
As for the bit articles, I tend to remove the bit articles that aren't technical on other topics, similar to blog articles from most commercial sources.
Personally, I think the pricing model for bit is itself a bit overpriced, not that it won't suit larger organizations, but still not convinced of the paradigm.
I think that something exposing an async iterator would be cleaner to use.
let count = 0;
let queue = [];
for await (const snapshot of createTraverser(...)) {
count++;
queue.push(sendEmail(snapshot.data());
if (queue.length >= 50) {
await promise.all(queue);
queue = [];
}
}
await promise.all(queue);
console.log(`Processed ${count} users.`);
The items can simply implement the async iterator methods, and fetch in batches internally.
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.
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.
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/
On the "All promises fulfilled" part. export const someFn = () => new Promise(() => { // Hahahahaha });I think that something exposing an async iterator would be cleaner to use. let count = 0; let queue = []; for await (const snapshot of createTraverser(...)) { count++; queue.push(sendEmail(snapshot.data()); if (queue.length >= 50) { await promise.all(queue); queue = []; } } await promise.all(queue); console.log(`Processed ${count} users.`); The items can simply implement the async iterator methods, and fetch in batches internally.