Skip to content

Reset prefetchCache when reloading a route. #617

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.

Sign up for GitHub

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

Merged
merged 3 commits into from
Jan 2, 2017
Merged

Reset prefetchCache when reloading a route. #617

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
fc75550
Reset prefetchCache when reloading a route.
arunoda Jan 2, 2017
0791178
Prefetch again when there's a HMR reload.
arunoda Jan 2, 2017
843c207
Make .send() to return a promise.
arunoda Jan 2, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
47 changes: 33 additions & 14 deletions lib/prefetch.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,14 +24,21 @@ class Messenger {
this._resetCache()
}

send (payload, cb) {
if (this.serviceWorkerState === 'REGISTERED') {
this._send(payload, cb)
} else {
this.serviceWorkerReadyCallbacks.push(() => {
this._send(payload, cb)
})
}
send (payload) {
return new Promise((resolve, reject) => {
if (this.serviceWorkerState === 'REGISTERED') {
this._send(payload, handleCallback)
} else {
this.serviceWorkerReadyCallbacks.push(() => {
this._send(payload, handleCallback)
})
}

function handleCallback (err) {
if (err) return reject(err)
return resolve()
}
})
}
Copy link
Contributor

@nkzawa nkzawa Jan 2, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should have only the promise version of the method.

Copy link
Contributor Author

@arunoda arunoda Jan 2, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah! That's true.

Copy link
Contributor Author

@arunoda arunoda Jan 2, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.


_send (payload, cb = () => {}) {
Expand Down Expand Up @@ -99,23 +106,35 @@ if (hasServiceWorkerSupport()) {
messenger = new Messenger()
}

export function prefetch (href) {
function getPrefetchUrl (href) {
let { pathname } = urlParse(href)
const url = `/_next/pages${pathname}`

return url
}

export async function prefetch (href) {
if (!hasServiceWorkerSupport()) return
if (!isLocal(href)) return

// Register the service worker if it's not.
messenger.ensureInitialized()

let { pathname } = urlParse(href)
// Add support for the index page

const url = `/_next/pages${pathname}`
const url = getPrefetchUrl(href)
if (PREFETCHED_URLS[url]) return

messenger.send({ action: 'ADD_URL', url: url })
await messenger.send({ action: 'ADD_URL', url: url })
PREFETCHED_URLS[url] = true
}

export async function reloadIfPrefetched (href) {
const url = getPrefetchUrl(href)
if (!PREFETCHED_URLS[url]) return

delete PREFETCHED_URLS[url]
await prefetch(href)
}

export default class LinkPrefetch extends React.Component {
render () {
const { href } = this.props
Expand Down
2 changes: 2 additions & 0 deletions lib/router/router.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { parse, format } from 'url'
import evalScript from '../eval-script'
import shallowEquals from '../shallow-equals'
import { EventEmitter } from 'events'
import { reloadIfPrefetched } from '../prefetch'

export default class Router extends EventEmitter {
constructor (pathname, query, { Component, ErrorComponent, ctx } = {}) {
Expand Down Expand Up @@ -77,6 +78,7 @@ export default class Router extends EventEmitter {

async reload (route) {
delete this.components[route]
await reloadIfPrefetched(route)
Copy link
Contributor

@nkzawa nkzawa Jan 2, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

reload is called only on special cases (errors, add/remove pages). I wonder if we don't have to fix another cases (webpack's normal HMRs) too.

Copy link
Contributor Author

@arunoda arunoda Jan 2, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We don't need to do anything for normal HMR since the page gets updated via HMR.

We need to do this, because we are removing the page from the cache and loading a error page instead.


if (route !== this.route) return

Expand Down