Skip to content
New issue

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

#

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

Already on GitHub? # to your account

feat(gatsby): invite people with long develop bundling times to try the lazy dev js bundling feature #28116

Merged
merged 5 commits into from
Nov 17, 2020
Merged

feat(gatsby): invite people with long develop bundling times to try the lazy dev js bundling feature #28116

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
fae7e04
WIP for inviting folks to try devjs feature
KyleAMathews Nov 17, 2020
ff87142
Update packages/gatsby-cli/src/reporter/redux/internal-actions.ts
KyleAMathews Nov 17, 2020
80da1e7
Merge remote-tracking branch 'origin/master' into invite-people
KyleAMathews Nov 17, 2020
4f77429
Use @pieh's new util for making alerts
KyleAMathews Nov 17, 2020
471faf6
Remove util from this PR
KyleAMathews Nov 17, 2020
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
5 changes: 5 additions & 0 deletions packages/gatsby/src/services/start-webpack-server.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ export async function startWebpackServer({
let {
compiler,
webpackActivity,
cancelDevJSNotice,
websocketManager,
webpackWatching,
} = await startServer(program, app, workerPool)
Expand Down Expand Up @@ -76,6 +77,10 @@ export async function startWebpackServer({
stats,
done
) {
if (cancelDevJSNotice) {
cancelDevJSNotice()
}

// "done" event fires when Webpack has finished recompiling the bundle.
// Whether or not you have warnings or errors, you will get this event.

Expand Down
2 changes: 1 addition & 1 deletion packages/gatsby/src/utils/show-experiment-notice.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ export function showExperimentNoticeAfterTimeout(
}

const noticeTimeout = setTimeout(() => {
reporter.info(noticeText)
reporter.info(`\n\n${noticeText}\n\n`)
Copy link
Contributor Author

Choose a reason for hiding this comment

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

@pieh a little spacing around the messages makes them stand out better. Without it they seemed lost in the logs


getConfigStore().set(configStoreKey, Date.now())
}, showNoticeAfterMs)
Expand Down
38 changes: 34 additions & 4 deletions packages/gatsby/src/utils/start-server.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,9 @@ import graphqlHTTP from "express-graphql"
import graphqlPlayground from "graphql-playground-middleware-express"
import graphiqlExplorer from "gatsby-graphiql-explorer"
import { formatError } from "graphql"
import telemetry from "gatsby-telemetry"
import http from "http"
import https from "https"

import webpackConfig from "../utils/webpack.config"
import { store, emitter } from "../redux"
Expand All @@ -20,10 +23,11 @@ import { withBasePath } from "../utils/path"
import report from "gatsby-cli/lib/reporter"
import launchEditor from "react-dev-utils/launchEditor"
import cors from "cors"
import telemetry from "gatsby-telemetry"
import * as WorkerPool from "../utils/worker/pool"
import http from "http"
import https from "https"
import {
showExperimentNoticeAfterTimeout,
CancelExperimentNoticeCallbackOrUndefined,
} from "../utils/show-experiment-notice"

import { developStatic } from "../commands/develop-static"
import withResolverContext from "../schema/context"
Expand All @@ -35,7 +39,7 @@ import {
} from "./page-data"
import { getPageData as getPageDataExperimental } from "./get-page-data"
import { findPageByPath } from "./find-page-by-path"
import { slash } from "gatsby-core-utils"
import { slash, isCI } from "gatsby-core-utils"
import apiRunnerNode from "../utils/api-runner-node"
import { Express } from "express"
import * as path from "path"
Expand All @@ -49,6 +53,7 @@ interface IServer {
compiler: webpack.Compiler
listener: http.Server | https.Server
webpackActivity: ActivityTracker
cancelDevJSNotice: CancelExperimentNoticeCallbackOrUndefined
websocketManager: WebsocketManager
workerPool: JestWorker
webpackWatching: IWebpackWatchingPauseResume
Expand Down Expand Up @@ -113,6 +118,30 @@ export async function startServer(
})
webpackActivity.start()

const TWENTY_SECONDS = 20 * 1000
let cancelDevJSNotice: CancelExperimentNoticeCallbackOrUndefined
if (
process.env.gatsby_executing_command === `develop` &&
!process.env.GATSBY_EXPERIMENT_DEVJS_LAZY &&
!isCI()
) {
cancelDevJSNotice = showExperimentNoticeAfterTimeout(
`LAZY_DEVJS`,
report.stripIndent(`
Your local development experience is about to get better, faster, and stronger!

Your friendly Gatsby maintainers detected your site takes longer than ideal to bundle your JavaScript. We're working right now to improve this.

If you're interested in trialing out one of these future improvements *today* which should make your local development experience faster, go ahead and run your site with LAZY_DEVJS enabled.

GATSBY_EXPERIMENT_DEVJS_LAZY=true gatsby develop

Please do let us know how it goes (good, bad, or otherwise) at https://gatsby.dev/lazy-devjs-umbrella
`),
TWENTY_SECONDS
)
}

const devConfig = await webpackConfig(
program,
directory,
Expand Down Expand Up @@ -363,6 +392,7 @@ export async function startServer(
compiler,
listener,
webpackActivity,
cancelDevJSNotice,
websocketManager,
workerPool,
webpackWatching: webpackDevMiddlewareInstance.context.watching,
Expand Down