Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[v0.6] Queues & Caches #65

Draft
wants to merge 8 commits into
base: main
Choose a base branch
from
Draft

[v0.6] Queues & Caches #65

wants to merge 8 commits into from

Conversation

imacrayon
Copy link
Owner

@imacrayon imacrayon commented Mar 25, 2024

This PR introduces a new request queuing and caching system that will support client-side routing features similar to hx-boost and Hotwire's Turbo.

The queue will handle concurrency issues in situations where multiple requests could cause race conditions, like when a user is clicking faster than the server can respond, or multiple AJAX requests target the same element on the page.

The cache will store AJAX responses in memory and reuse the response on subsequent requests before requesting fresh data. The user will experience instant UI changes as they navigate between pages that have been cached.

I'd also like to introduce support for pre-fetching requests to make page navigation feel even faster.

I also rewrote Alpine AJAX using a class-based architecture, concepts are better organized now, and the code base is a few kBs smaller when compressed. The project ended up growing considerably in size, so I reverted a lot of these changes.

So far I don't see any new APIs required to make this all work. My plan is that it will all just be automatically available after installing Alpine AJAX.

@imacrayon imacrayon added bug Something isn't working and removed bug Something isn't working labels Mar 27, 2024
@imacrayon
Copy link
Owner Author

imacrayon commented Apr 6, 2024

Alright, all tests except for the redirect tests are passing now. Redirects will need to be handled a little differently now because full page reloads no longer exist. I still have a few bigger concerns to work through before I feel good about adding this features:

  1. Cache snapshots: Alpine AJAX caches previous page requests. When making a new request, if a cached request exists, Alpine AJAX will immediately render a "snapshot" of the cached request before issuing a request for fresh content. Once fresh content is received the snapshot is replaced with the new content. This makes page navigation feel super fast, but every request for content essentially triggers two render passes. I'm worried that on slow networks these two renders could produce a jarring experience as the UI swaps between stale and fresh content. I want to try out this "snapshot" feature it a few apps and make sure it feels good.
  2. Slow initial renders: Navigating to a page you've already visited now feels almost instant, however every request to a new page is slightly slower than a standard full page refresh. This is because Alpine AJAX has to spend extra cycles rendering content and merging the <head> element between page requests. After some testing I've found these same issue to be true for most other client side navigation libraries (Turbo, HTMX, Unpoly, Livewire), but I'm not convinced that this tradeoff is really worth it for users. I want to look into ways Alpine AJAX might be able to work around these trade offs using a Service Worker. We might be able to offload some of the extra rendering work to the browser (fast) instead of JavaScript (slow).

@jdmry
Copy link

jdmry commented Apr 17, 2024

Hey, that all sounds good and it's something I felt I missed from this library compared to others indeed.
However I just read and tried the library you've mentioned in one of the issue 'instant.page' and tbh that does the trick.. really loving it!

@saolof
Copy link

saolof commented Apr 25, 2024

I just want to mention that I am incredibly impressed by how everything just beautifully falls out of the basic rules of this library!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants