Comments (2)
So far the two possible solutions me and @GuiDevloper came to are:
Explicit referral:
// referral in any link sets it to the context as is
<a href="/books/1" referral={book}>
// referral can be destructured anywhere from the context until the next anchor click replaces it
async initiate({ referral }) {
this.book = referral || await this.getBookFromServer()
}
pro: this is very explicit
con: the code is very similar to setting an event that saves to the context and might become verbose
Implicit state
// state in a link forwards it to the next (first or all to be decided) match for the route on click
<a href="/books/1" state={{book}}>
// the component automatically receives the state before prepare is invoked
async initiate() {
this.book ||= await this.getBookFromServer()
}
pro: you don't have to think to much about it, it is an nearly free optimization
con: it could cause problems because you are unaware of this dependency, so far Nullstack has no implicit behavior outside of the context
from nullstack.
The same behavior can be achieved in a more granular way using the already implemented features of the context with the advantage of being able to cache the full list and implementing advanced features like stale while revalidate.
Ill close this issue with an example using cache + revalidation in a explicit manner that implicit state would prevent implementing:
class Books extends Nullstack {
prepare({ project, page, cachedBooks }) {
page.title = `Books - ${project.name}`;
this.books = cachedBooks;
}
static async getBooks({ database }) {
return await database.collection('books').find().toArray();
}
async initiate(context) {
this.books = await this.getBooks();
context.cachedBooks = data.books;
}
}
class Book extends Nullstack {
static async getBookBySlug({ database, slug }) {
return await database.collection('books').findOne({slug});
}
prepare({ params, cachedBooks }) {
this.book = cachedBooks?.find(({ slug }) => slug === params.slug);
}
async initiate({ params, project, page }) {
this.book = await this.getBookBySlug({ slug: params.slug });
}
}
from nullstack.
Related Issues (20)
- M1 Mac issue with node v16 fiber HOT 3
- this.renderNullstack returning undefined HOT 1
- Does support a vite template? HOT 1
- Typescript error: Not export *.d.ts types HOT 2
- onfocus/onblur don't work together on production mode HOT 2
- textarea attribute "disabled" won't update it's value when tied to nullstack state HOT 1
- meta tag description is no longer updated HOT 1
- Textarea doesn't accept bind as undefined HOT 2
- M1 - postcss loader breaks HOT 5
- Description header not be apply HOT 5
- .env variables not be referenced as a value HOT 2
- Using spread operator in combination with onclick on tag prop breaks the build HOT 3
- 🐛 Error thrown when using exposed server function with HTTP POST method HOT 1
- Output folder is not being cleaned up with --disk flag HOT 1
- The `onerror` event in `img` elements isn't being triggered correctly when SSR is involved HOT 3
- Comments not being respected by sass-loader HOT 1
- Refs are not properly typed HOT 1
- 0.18+ not reloading function components HOT 2
- Fix conflict with invokerHash and boundHash separator HOT 1
- Please help HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from nullstack.