Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 6561deb

Browse files
piehpieh
committed
Merge branch 'wip-query-webpack-modules-and-static-queries' into wip-page-data-processors-and-components-from-graphql
2 parents 1f8fbc9 + fb39a9e commit 6561deb

23 files changed

+591
-158
lines changed

‎packages/gatsby/cache-dir/app.js

Lines changed: 26 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,38 @@ import emitter from "./emitter"
88
import { apiRunner, apiRunnerAsync } from "./api-runner-browser"
99
import { setLoader, publicLoader } from "./loader"
1010
import DevLoader from "./dev-loader"
11-
import syncRequires from "./sync-requires"
11+
// import syncRequires from "./sync-requires"
12+
const syncRequires = require(`./sync-requires`)
1213
// Generated during bootstrap
1314
import matchPaths from "./match-paths.json"
1415

1516
window.___emitter = emitter
1617

17-
const loader = new DevLoader(syncRequires, matchPaths)
18+
let loader = new DevLoader(syncRequires, matchPaths)
1819
setLoader(loader)
20+
21+
console.log(`wut`)
22+
module.hot.accept(() => {
23+
console.log(`[app.js] what`)
24+
return
25+
})
26+
27+
// setInterval(() => {
28+
// console.log(`[app.js]`, module.hot.status())
29+
// }, 1000)
30+
31+
module.hot.addStatusHandler(status => {
32+
console.log(`[app.js] status`, status)
33+
if (status === `idle`) {
34+
loader.syncRequires = require(`./sync-requires`)
35+
// const newSyncReuires = require(`./sync-requires`)
36+
// loader = new DevLoader(syncRequires, matchPaths)
37+
// setLoader(loader)
38+
// loader.setApiRunner(apiRunner)
39+
// console.log("reqs?", { newSyncReuires, syncRequires })
40+
}
41+
})
42+
1943
loader.setApiRunner(apiRunner)
2044

2145
window.___loader = publicLoader

‎packages/gatsby/cache-dir/dev-loader.js

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,29 @@ import { findPath } from "./find-path"
33

44
class DevLoader extends BaseLoader {
55
constructor(syncRequires, matchPaths) {
6-
const loadComponent = (chunkName, key = `components`) =>
7-
Promise.resolve(syncRequires[key][chunkName])
6+
const loadComponent = (chunkName, key = `components`, retry = 0) => {
7+
console.log(
8+
`loadComponent #${retry + 1}`,
9+
{ chunkName, key },
10+
{ ...this.syncRequires }
11+
)
12+
const mod = this.syncRequires[key][chunkName]
13+
const interval = 500
14+
const retryDuration = 5000
15+
if (!mod && retry < Math.ceil(retryDuration / interval)) {
16+
// that might be after hot reload when webpack hot update wasn't handled yet
17+
return new Promise(resolve =>
18+
setTimeout(() => {
19+
this.loadComponent(chunkName, key, retry + 1).then(resolve)
20+
}, 500)
21+
)
22+
}
23+
24+
return Promise.resolve(mod)
25+
}
826
super(loadComponent, matchPaths)
27+
28+
this.syncRequires = syncRequires
929
}
1030

1131
loadPage(pagePath) {

‎packages/gatsby/cache-dir/gatsby-browser-entry.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -76,11 +76,11 @@ useStaticQuery(graphql\`${query}\`);
7676
if (context && context[query] && context[query].data) {
7777
return context[query].data
7878
} else {
79-
// throw new Error(
80-
// `The result of this StaticQuery could not be fetched.\n\n` +
81-
// `This is likely a bug in Gatsby and if refreshing the page does not fix it, ` +
82-
// `please open an issue in https://github.com/gatsbyjs/gatsby/issues`
83-
// )
79+
throw new Error(
80+
`The result of this StaticQuery could not be fetched.\n\n` +
81+
`This is likely a bug in Gatsby and if refreshing the page does not fix it, ` +
82+
`please open an issue in https://github.com/gatsbyjs/gatsby/issues`
83+
)
8484
}
8585
}
8686

‎packages/gatsby/cache-dir/loader.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -547,4 +547,6 @@ export const publicLoader = {
547547
loadAppData: () => instance.loadAppData(),
548548
}
549549

550+
export { instance as internalLoader }
551+
550552
export default publicLoader

‎packages/gatsby/cache-dir/query-result-store.js

Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -68,21 +68,40 @@ export class PageQueryStore extends React.Component {
6868
// - location changed
6969
// - page data for path changed
7070

71-
return (
71+
const shouldUpdate =
7272
this.props.location !== nextProps.location ||
7373
this.state.path !== nextState.path ||
7474
this.state.pageQueryData[normalizePagePath(nextState.path)] !==
7575
nextState.pageQueryData[normalizePagePath(nextState.path)]
76-
)
76+
77+
if (shouldUpdate) {
78+
console.log(`[query-result-store] shouldComponentUpdate`, {
79+
locationD: this.props.location !== nextProps.location,
80+
pathD: this.state.path !== nextState.path,
81+
pageQueryD:
82+
this.state.pageQueryData[normalizePagePath(nextState.path)] !==
83+
nextState.pageQueryData[normalizePagePath(nextState.path)],
84+
currentProps: { ...this.props },
85+
currentState: { ...this.state },
86+
nextProps: { ...nextProps },
87+
nextState: { ...nextState },
88+
})
89+
}
90+
91+
return shouldUpdate
7792
}
7893

7994
render() {
8095
const data = this.state.pageQueryData[getPathFromProps(this.props)]
96+
8197
// eslint-disable-next-line
8298
if (!data) {
8399
return <div />
84100
}
85101

102+
// const { moduleDependencies, ...data } = stuff
103+
console.log(`[query-result-store] Render`)
104+
86105
return <PageRenderer {...this.props} {...data} />
87106
}
88107
}

‎packages/gatsby/cache-dir/socketIo.js

Lines changed: 27 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { reportError, clearError } from "./error-overlay-handler"
22
import normalizePagePath from "./normalize-page-path"
3+
import { internalLoader } from "./loader"
34

45
let socket = null
56

@@ -20,16 +21,14 @@ export default function socketIo() {
2021
socket = io()
2122

2223
const didDataChange = (msg, queryData) => {
23-
2424
const id =
2525
msg.type === `staticQueryResult`
2626
? msg.payload.id
2727
: normalizePagePath(msg.payload.id)
2828

29-
const changed = (
29+
const changed =
3030
!(id in queryData) ||
3131
JSON.stringify(msg.payload.result) !== JSON.stringify(queryData[id])
32-
)
3332

3433
console.log({
3534
id,
@@ -51,9 +50,29 @@ export default function socketIo() {
5150
}
5251
} else if (msg.type === `pageQueryResult`) {
5352
if (didDataChange(msg, pageQueryData)) {
54-
pageQueryData = {
55-
...pageQueryData,
56-
[normalizePagePath(msg.payload.id)]: msg.payload.result,
53+
// special path for this because we will emit after async stuff
54+
if (msg.payload.result) {
55+
const { moduleDependencies, ...rest } = msg.payload.result
56+
console.log(
57+
`[socket-io] new data via websocket, making sure modules are fine`
58+
)
59+
Promise.all(
60+
internalLoader.fetchAndEmitModuleDependencies(
61+
moduleDependencies
62+
)
63+
).then(() => {
64+
console.log(
65+
`[socket-io] fetched modules after data hor refresh - passing it down to components`
66+
)
67+
pageQueryData = {
68+
...pageQueryData,
69+
[normalizePagePath(msg.payload.id)]: msg.payload.result,
70+
}
71+
72+
___emitter.emit(msg.type, msg.payload)
73+
})
74+
75+
return
5776
}
5877
}
5978
// } else if (msg.type === `pageData`) {
@@ -71,7 +90,9 @@ export default function socketIo() {
7190
clearError(msg.payload.id)
7291
}
7392
}
93+
7494
if (msg.type && msg.payload) {
95+
console.log(`[socket-io] regular ___emit`)
7596
___emitter.emit(msg.type, msg.payload)
7697
}
7798
})

‎packages/gatsby/src/bootstrap/requires-writer.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ const { store, emitter } = require(`../redux/`)
77
const reporter = require(`gatsby-cli/lib/reporter`)
88
const { match } = require(`@reach/router/lib/utils`)
99
import { joinPath } from "gatsby-core-utils"
10+
import * as webpackStatusUtil from "../utils/webpack-status"
1011

1112
// path ranking algorithm copied (with small adjustments) from `@reach/router` (internal util, not exported from the package)
1213
// https://github.com/reach/router/blob/28a79e7fc3a3487cb3304210dc3501efb8a50eba/src/lib/utils.js#L216-L254
@@ -241,6 +242,7 @@ const debouncedWriteAll = _.debounce(
241242
const didRequiresChange = await writeAll(store.getState())
242243
if (didRequiresChange) {
243244
reporter.pendingActivity({ id: `webpack-develop` })
245+
webpackStatusUtil.markAsPending()
244246
}
245247
activity.end()
246248
},

‎packages/gatsby/src/commands/build.ts

Lines changed: 43 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import path from "path"
22
import report from "gatsby-cli/lib/reporter"
33
import signalExit from "signal-exit"
44
import fs from "fs-extra"
5+
import { isEqual } from "lodash"
56
import telemetry from "gatsby-telemetry"
67

78
import { buildHTML } from "./build-html"
@@ -28,7 +29,11 @@ import { boundActionCreators } from "../redux/actions"
2829
import { waitUntilAllJobsComplete } from "../utils/wait-until-jobs-complete"
2930
import { IProgram, Stage } from "./types"
3031
import { PackageJson } from "../.."
31-
import { mapPagesToStaticQueryHashes } from "../utils/map-pages-to-static-query-hashes"
32+
import {
33+
// mapPagesToStaticQueryHashes,
34+
mapTemplatesToStaticQueryHashes,
35+
} from "../utils/map-pages-to-static-query-hashes"
36+
import * as webpackStatusUtil from "../utils/webpack-status"
3237

3338
let cachedPageData
3439
let cachedWebpackCompilationHash
@@ -56,6 +61,9 @@ module.exports = async function build(program: IBuildArgs): Promise<void> {
5661
)
5762
}
5863

64+
program.command = `build`
65+
webpackStatusUtil.markAsPending()
66+
5967
const publicDir = path.join(program.directory, `public`)
6068
initTracer(program.openTracingConfigFile)
6169
const buildActivity = report.phantomActivity(`build`)
@@ -129,13 +137,6 @@ module.exports = async function build(program: IBuildArgs): Promise<void> {
129137

130138
const workerPool = WorkerPool.create()
131139

132-
const state = store.getState()
133-
134-
const mapOfPagesToStaticQueryHashes = mapPagesToStaticQueryHashes(
135-
state,
136-
stats
137-
)
138-
139140
const webpackCompilationHash = stats.hash
140141
if (
141142
webpackCompilationHash !== store.getState().webpackCompilationHash ||
@@ -156,21 +157,43 @@ module.exports = async function build(program: IBuildArgs): Promise<void> {
156157
activity.end()
157158
}
158159

159-
mapOfPagesToStaticQueryHashes.forEach(async (staticQueryHashes, pagePath) => {
160-
const page = state.pages.get(pagePath)
161-
const moduleDependencies = Array.from(
162-
state.queryModuleDependencies.get(pagePath) || []
160+
{
161+
const state = store.getState()
162+
const mapOfTemplatesToStaticQueryHashes = mapTemplatesToStaticQueryHashes(
163+
state,
164+
stats
165+
)
166+
167+
mapOfTemplatesToStaticQueryHashes.forEach(
168+
(staticQueryHashes, componentPath) => {
169+
if (
170+
!isEqual(
171+
state.staticQueriesByTemplate.get(componentPath)?.sort(),
172+
staticQueryHashes.map(toString)?.sort()
173+
)
174+
) {
175+
store.dispatch({
176+
type: `ADD_PENDING_TEMPLATE_DATA_WRITE`,
177+
payload: {
178+
componentPath,
179+
},
180+
})
181+
store.dispatch({
182+
type: `SET_STATIC_QUERIES_BY_TEMPLATE`,
183+
payload: {
184+
componentPath,
185+
staticQueryHashes,
186+
},
187+
})
188+
}
189+
}
163190
)
164191

165-
const pageDataProcessors =
166-
state.pageDataProcessors.get(pagePath) || new Map()
192+
await pageDataUtil.flush()
193+
webpackStatusUtil.markAsDone()
167194

168-
await pageDataUtil.writePageData({ publicDir }, page, {
169-
staticQueryHashes,
170-
moduleDependencies,
171-
pageDataProcessors,
172-
})
173-
})
195+
console.log(store.getState().pendingPageDataWrites)
196+
}
174197

175198
if (process.env.GATSBY_EXPERIMENTAL_PAGE_BUILD_ON_DATA_CHANGES) {
176199
const { pages } = store.getState()

0 commit comments

Comments
 (0)