fabiancook

On and off working on the Navigation API for Node, Bun, Deno, & as a browser polyfill.

Has 90% test coverage, makes use of web platform tests to verify compatibility, and is in use by some larger companies already with the Navigation API soon to become a baseline in evergreen browsers.

The Navigation API effectively is async state navigations. The likes of React has recently added Navigation API support to make use of the browser reload indicator.

https://github.com/virtualstate/navigation

Along with working on a startup day to day :)

Do you want just JSX in browsers?

Or do you want a "native virtual DOM".... that is the DOM we have today.

There is various new tools coming available that make working with a browser so much easier.

In the past for example there was no way to do a SPA transition between pages, this was one of the big things handled by the likes of react alongside of the vdoms, but by tooling like react-router for the likes of react. This made it pretty much that you needed to use the likes of react to make state based changes to the DOM.

Now... we have the navigation API where you can have an async change happen on navigate and prevent

Very soon you'll be able to do this:

    navigation.addEventListener("navigate", event => {
      event.intercept({
        async handler() {
          const state = event.destination.getState();
          document.body.setHTML(`
      <div>
        <p>Paragraph to inject into shadow DOM.
          <button onclick="alert('You clicked the button with value ${state.key}!')">Click me</button>
        </p>
        <script src="path/to/a/module.js" type="module"><\/script>
        <p data-id="${state.key}">Para with <code>data-id</code> attribute with value <code>${state.key}</code></p>
      </div>
          `)
        }
      })
    });

Yes this use of just setting a string is not giving all the nice things like diffing and all... but, we have then a state API tied to the browser navigation, along with a way to know the navigation was successful:

    await navigation.navigate("/somewhere", { state: { key: "value } }).finished;

Awesome to see the Navigation API being talked about at DevFest.

The API is available in chrome today. Safari & Firefox are actively developing their implementations too.

MDN Documentation: https://developer.mozilla.org/en-US/docs/Web/API/Navigation_...

JavaScript implementation usable as polyfill: https://github.com/virtualstate/navigation (I am the author of this repository)

I paid for the service. When it works for a specific bit of boilerplate code or section of obvious code, its handy.

It definitely doesn't know the whole context of my project, or that it should use xyz imports to achieve a specific task from the same project.

It will get better with time I am sure.

I read through the privacy policy and other policies ahead of time too, nothing concerning for what I am doing. Is backed by OpenAI.

* https://www.jetbrains.com/help/ai/data-collection-and-use-po...

* https://www.jetbrains.com/legal/docs/terms/jetbrains-ai/serv...

The UK also sells CBD vapes, I wonder how this will change that.

I would imagine their wording of whatever they put in place will be broad enough to cover just anything disposable that produces vapour

Had just read this other article earlier today... lots of sound therapy for cancer coming about! https://www.science.org/doi/10.1126/sciadv.adg5964

To tackle this, I always needed to write a little script for my TypeScript projects that were all being published as ESM:

https://github.com/virtualstate/promise/blob/main/scripts/co...

https://github.com/virtualstate/focus/blob/main/scripts/corr...

https://github.com/virtualstate/navigation/blob/main/scripts...

This same script was replicated to near every repository I have worked on, including making its way into a few different production services where Node.js + ESM was used for deployment

Eventually I had turned into a utility module that could be used wider, which starts to lean into import map generation

https://github.com/virtualstate/impack#usage

You can see it being used here as a function, but can be used as a cli tool too:

https://github.com/virtualstate/listen/blob/033bf8effcbde5c8...

Publications like pubmed are generally a good source to read from, check the citations on the article & check its review status.

If you have an article that you found with a helpful summary but it doesn't have the full source, take the "doi" link to sci-hub to get the full source.

Try to stay away from any article on any site that doesn't have a research article referenced that has a doi number.

Do checkout discussion around the endocannabinoid system in relation to recovery & chemotherapy support.

When you get the details on the specific chemotherapy being done, you'll have a specific couple of chemicals to be able to search through... for example Gemcitabine and Carboplatin. Different kinds of cancers have a different sets of chemotherapy chemicals related.

I'll mention that I have a close family member with terminal lung cancer. Following the above we've been successfully treating his symptoms and have also reduced the size of the primary tumour along the way (It was non operable & no radiation could be done)

https://github.com/tc39/proposal-function-memo

This might be relevant to this exact pattern

  const getThing = (async function (arg1, arg2) {
    console.log({ arg1, arg2 });
    return arg1 + (arg2 || 0);
  }).memo();

  console.log(await getThing(1)); // New promise
  console.log(await getThing(2)); // New promise
  console.log(await getThing(1)); // Returns promise from earlier

Direct paper link https://arxiv.org/abs/2111.06507

Discussed here too https://news.ycombinator.com/item?id=30775180

No paywall: https://web.archive.org/web/20220324080026/https://www.nytim...

Pretty cool exercise to go through!

TLDR birth causing WFM, producing a verified backup chain.

I have been using fastmail, my main email address is hi@, but I have set up a routing rule for *, anything that is going to produce obvious spam, for example if I wanted to get a discount code through email, I would use spam@ and have a rule set up for all of these emails to go to deleted, I can still check them for 10 days.

other things I have rules set up for too, to go to inboxes.

fastmail also lets you reply as the email that was sent to, so if someone emails me at test@ they will get a response from test@

I have been using fastmail, my main email address is hi@<domain>, but I have set up a routing rule for *@<domain>, anything that is going to produce obvious spam, for example if I wanted to get a discount code through email, I would use spam@<domain> and have a rule set up for all of these emails to go to deleted, I can still check them for 10 days.

other things I have rules set up for too, to go to inboxes.

fastmail also lets you reply as the email that was sent to, so if someone emails me at test@<domain> they will get a response from test@<domain>

Alternative full PDF link from scihub https://sci-hub.hkvisa.net/10.1145/358886.358892

I was hoping this was going to be a whitepaper version of dev.to... clicked so fast.

Or esm.sh mentioned in another comment

https://esm.sh/vue/dist/vue.esm.js

Great write up.

Would like to direct to skypack.dev too for zero build tool imports as well!

e.g. https://cdn.skypack.dev/vue/dist/vue.esm.js

damn

I will be applying this to a lot of commits from the past and in the future!

Makes sense to have these trailers as something thats parsable some point in the future.

Very cool! Nice and slim, straight diff and apply. Cool to see someone use something other than `h` :P