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

Feature/less styles #23185

Closed
wants to merge 4 commits into from
Closed

Conversation

vbudovski
Copy link

Implement support for Less styles within Next.js.

@ijjk
Copy link
Member

ijjk commented Mar 18, 2021

Stats from current PR

Default Server Mode (Decrease detected ✓)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 12.1s 12.4s ⚠️ +293ms
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Page Load Tests Overall decrease ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 2.177 2.135 -0.04
/ avg req/sec 1148.39 1170.79 +22.4
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.269 1.415 ⚠️ +0.15
/error-in-render avg req/sec 1970.8 1766.31 ⚠️ -204.49
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
677f882d2ed8..a2e7.js gzip 13.4 kB 13.4 kB
framework.HASH.js gzip 39 kB 39 kB
main-HASH.js gzip 7.14 kB 7.14 kB
webpack-HASH.js gzip 751 B 751 B
Overall change 60.3 kB 60.3 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB
Overall change 31.3 kB 31.3 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-fde3324..9dd1.js gzip 1.28 kB 1.28 kB
_error-af59f..582f.js gzip 3.46 kB 3.46 kB
amp-9716187d..0aa8.js gzip 536 B 536 B
hooks-107e90..74c7.js gzip 888 B 888 B
index-ac435c..ecf2.js gzip 227 B 227 B
link-e6cee42..49eb.js gzip 1.64 kB 1.64 kB
routerDirect..dc9d.js gzip 303 B 303 B
withRouter-6..0e02.js gzip 302 B 302 B
Overall change 8.64 kB 8.64 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 346 B 346 B
Overall change 346 B 346 B
Rendered Page Sizes
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 614 B 614 B
link.html gzip 622 B 622 B
withRouter.html gzip 608 B 608 B
Overall change 1.84 kB 1.84 kB

Serverless Mode
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 14.2s 14.2s ⚠️ +27ms
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
677f882d2ed8..a2e7.js gzip 13.4 kB 13.4 kB
framework.HASH.js gzip 39 kB 39 kB
main-HASH.js gzip 7.14 kB 7.14 kB
webpack-HASH.js gzip 751 B 751 B
Overall change 60.3 kB 60.3 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB
Overall change 31.3 kB 31.3 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-fde3324..9dd1.js gzip 1.28 kB 1.28 kB
_error-af59f..582f.js gzip 3.46 kB 3.46 kB
amp-9716187d..0aa8.js gzip 536 B 536 B
hooks-107e90..74c7.js gzip 888 B 888 B
index-ac435c..ecf2.js gzip 227 B 227 B
link-e6cee42..49eb.js gzip 1.64 kB 1.64 kB
routerDirect..dc9d.js gzip 303 B 303 B
withRouter-6..0e02.js gzip 302 B 302 B
Overall change 8.64 kB 8.64 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 346 B 346 B
Overall change 346 B 346 B
Serverless bundles
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_error.js 1.02 MB 1.02 MB
404.html 2.67 kB 2.67 kB
500.html 2.65 kB 2.65 kB
amp.amp.html 10.6 kB 10.6 kB
amp.html 1.86 kB 1.86 kB
hooks.html 1.92 kB 1.92 kB
index.js 1.02 MB 1.02 MB
link.js 1.08 MB 1.08 MB
routerDirect.js 1.07 MB 1.07 MB
withRouter.js 1.07 MB 1.07 MB
Overall change 5.27 MB 5.27 MB

Webpack 5 Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 14s 14.2s ⚠️ +188ms
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Page Load Tests Overall increase ✓
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 2.122 2.132 ⚠️ +0.01
/ avg req/sec 1178.25 1172.4 ⚠️ -5.85
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.26 1.243 -0.02
/error-in-render avg req/sec 1983.6 2011.11 +27.51
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
597-12fee761..569d.js gzip 13.3 kB 13.3 kB
framework.HASH.js gzip 39.3 kB 39.3 kB
main-HASH.js gzip 7.1 kB 7.1 kB
webpack-HASH.js gzip 993 B 993 B
Overall change 60.7 kB 60.7 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.1 kB 31.1 kB
Overall change 31.1 kB 31.1 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-d0eb668..79ef.js gzip 1.28 kB 1.28 kB
_error-d12ff..6063.js gzip 3.4 kB 3.4 kB
amp-127483e4..9cd8.js gzip 560 B 560 B
hooks-75994b..62d3.js gzip 924 B 924 B
index-ac1ee6..819e.js gzip 243 B 243 B
link-1cd4709..71e5.js gzip 1.65 kB 1.65 kB
routerDirect..4d90.js gzip 333 B 333 B
withRouter-0..60b0.js gzip 329 B 329 B
Overall change 8.72 kB 8.72 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 324 B 324 B
Overall change 324 B 324 B
Rendered Page Sizes
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 586 B 586 B
link.html gzip 592 B 592 B
withRouter.html gzip 580 B 580 B
Overall change 1.76 kB 1.76 kB

Diffs

Diff for index.html
@@ -43,7 +43,7 @@
         "props": { "pageProps": {} },
         "page": "/",
         "query": {},
-        "buildId": "1Bs7mB0-F_sH-5dhnxa30",
+        "buildId": "HI0Do3bvpqEEtqWd5fhF2",
         "isFallback": false,
         "gip": true
       }
@@ -77,11 +77,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/1Bs7mB0-F_sH-5dhnxa30/_buildManifest.js"
+      src="/_next/static/HI0Do3bvpqEEtqWd5fhF2/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/1Bs7mB0-F_sH-5dhnxa30/_ssgManifest.js"
+      src="/_next/static/HI0Do3bvpqEEtqWd5fhF2/_ssgManifest.js"
       async=""
     ></script>
   </body>
Diff for link.html
@@ -48,7 +48,7 @@
         "props": { "pageProps": {} },
         "page": "/link",
         "query": {},
-        "buildId": "1Bs7mB0-F_sH-5dhnxa30",
+        "buildId": "HI0Do3bvpqEEtqWd5fhF2",
         "isFallback": false,
         "gip": true
       }
@@ -82,11 +82,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/1Bs7mB0-F_sH-5dhnxa30/_buildManifest.js"
+      src="/_next/static/HI0Do3bvpqEEtqWd5fhF2/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/1Bs7mB0-F_sH-5dhnxa30/_ssgManifest.js"
+      src="/_next/static/HI0Do3bvpqEEtqWd5fhF2/_ssgManifest.js"
       async=""
     ></script>
   </body>
Diff for withRouter.html
@@ -43,7 +43,7 @@
         "props": { "pageProps": {} },
         "page": "/withRouter",
         "query": {},
-        "buildId": "1Bs7mB0-F_sH-5dhnxa30",
+        "buildId": "HI0Do3bvpqEEtqWd5fhF2",
         "isFallback": false,
         "gip": true
       }
@@ -77,11 +77,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/1Bs7mB0-F_sH-5dhnxa30/_buildManifest.js"
+      src="/_next/static/HI0Do3bvpqEEtqWd5fhF2/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/1Bs7mB0-F_sH-5dhnxa30/_ssgManifest.js"
+      src="/_next/static/HI0Do3bvpqEEtqWd5fhF2/_ssgManifest.js"
       async=""
     ></script>
   </body>
Commit: 473c82a

@ijjk
Copy link
Member

ijjk commented Mar 19, 2021

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 13.2s 15.7s ⚠️ +2.6s
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Page Load Tests Overall increase ✓
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 2.384 2.301 -0.08
/ avg req/sec 1048.75 1086.6 +37.85
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.524 1.526 0
/error-in-render avg req/sec 1640.69 1638.09 ⚠️ -2.6
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
677f882d2ed8..a2e7.js gzip 13.4 kB 13.4 kB
framework.HASH.js gzip 39 kB 39 kB
main-HASH.js gzip 7.14 kB 7.14 kB
webpack-HASH.js gzip 751 B 751 B
Overall change 60.3 kB 60.3 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB
Overall change 31.3 kB 31.3 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-fde3324..9dd1.js gzip 1.28 kB 1.28 kB
_error-af59f..582f.js gzip 3.46 kB 3.46 kB
amp-9716187d..0aa8.js gzip 536 B 536 B
hooks-107e90..74c7.js gzip 888 B 888 B
index-ac435c..ecf2.js gzip 227 B 227 B
link-e6cee42..49eb.js gzip 1.64 kB 1.64 kB
routerDirect..dc9d.js gzip 303 B 303 B
withRouter-6..0e02.js gzip 302 B 302 B
Overall change 8.64 kB 8.64 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 346 B 346 B
Overall change 346 B 346 B
Rendered Page Sizes
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 613 B 613 B
link.html gzip 620 B 620 B
withRouter.html gzip 608 B 608 B
Overall change 1.84 kB 1.84 kB

Serverless Mode
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 18.4s 15.9s -2.5s
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
677f882d2ed8..a2e7.js gzip 13.4 kB 13.4 kB
framework.HASH.js gzip 39 kB 39 kB
main-HASH.js gzip 7.14 kB 7.14 kB
webpack-HASH.js gzip 751 B 751 B
Overall change 60.3 kB 60.3 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB
Overall change 31.3 kB 31.3 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-fde3324..9dd1.js gzip 1.28 kB 1.28 kB
_error-af59f..582f.js gzip 3.46 kB 3.46 kB
amp-9716187d..0aa8.js gzip 536 B 536 B
hooks-107e90..74c7.js gzip 888 B 888 B
index-ac435c..ecf2.js gzip 227 B 227 B
link-e6cee42..49eb.js gzip 1.64 kB 1.64 kB
routerDirect..dc9d.js gzip 303 B 303 B
withRouter-6..0e02.js gzip 302 B 302 B
Overall change 8.64 kB 8.64 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 346 B 346 B
Overall change 346 B 346 B
Serverless bundles
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_error.js 1.02 MB 1.02 MB
404.html 2.67 kB 2.67 kB
500.html 2.65 kB 2.65 kB
amp.amp.html 10.6 kB 10.6 kB
amp.html 1.86 kB 1.86 kB
hooks.html 1.92 kB 1.92 kB
index.js 1.02 MB 1.02 MB
link.js 1.08 MB 1.08 MB
routerDirect.js 1.07 MB 1.07 MB
withRouter.js 1.07 MB 1.07 MB
Overall change 5.27 MB 5.27 MB

Webpack 5 Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 18.5s 16.3s -2.2s
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Page Load Tests Overall increase ✓
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 2.71 2.219 -0.49
/ avg req/sec 922.35 1126.49 +204.14
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 2.552 1.405 -1.15
/error-in-render avg req/sec 979.5 1779.31 +799.81
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
597-12fee761..569d.js gzip 13.3 kB 13.3 kB
framework.HASH.js gzip 39.3 kB 39.3 kB
main-HASH.js gzip 7.1 kB 7.1 kB
webpack-HASH.js gzip 993 B 993 B
Overall change 60.7 kB 60.7 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.1 kB 31.1 kB
Overall change 31.1 kB 31.1 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-d0eb668..79ef.js gzip 1.28 kB 1.28 kB
_error-d12ff..6063.js gzip 3.4 kB 3.4 kB
amp-127483e4..9cd8.js gzip 560 B 560 B
hooks-75994b..62d3.js gzip 924 B 924 B
index-ac1ee6..819e.js gzip 243 B 243 B
link-1cd4709..71e5.js gzip 1.65 kB 1.65 kB
routerDirect..4d90.js gzip 333 B 333 B
withRouter-0..60b0.js gzip 329 B 329 B
Overall change 8.72 kB 8.72 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 324 B 324 B
Overall change 324 B 324 B
Rendered Page Sizes
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 586 B 586 B
link.html gzip 593 B 593 B
withRouter.html gzip 581 B 581 B
Overall change 1.76 kB 1.76 kB

Diffs

Diff for index.html
@@ -43,7 +43,7 @@
         "props": { "pageProps": {} },
         "page": "/",
         "query": {},
-        "buildId": "qiSGzf_EiXhKzQNab3M65",
+        "buildId": "GGuOdIy_Kt2E8KYMsaRR9",
         "isFallback": false,
         "gip": true
       }
@@ -77,11 +77,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/qiSGzf_EiXhKzQNab3M65/_buildManifest.js"
+      src="/_next/static/GGuOdIy_Kt2E8KYMsaRR9/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/qiSGzf_EiXhKzQNab3M65/_ssgManifest.js"
+      src="/_next/static/GGuOdIy_Kt2E8KYMsaRR9/_ssgManifest.js"
       async=""
     ></script>
   </body>
Diff for link.html
@@ -48,7 +48,7 @@
         "props": { "pageProps": {} },
         "page": "/link",
         "query": {},
-        "buildId": "qiSGzf_EiXhKzQNab3M65",
+        "buildId": "GGuOdIy_Kt2E8KYMsaRR9",
         "isFallback": false,
         "gip": true
       }
@@ -82,11 +82,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/qiSGzf_EiXhKzQNab3M65/_buildManifest.js"
+      src="/_next/static/GGuOdIy_Kt2E8KYMsaRR9/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/qiSGzf_EiXhKzQNab3M65/_ssgManifest.js"
+      src="/_next/static/GGuOdIy_Kt2E8KYMsaRR9/_ssgManifest.js"
       async=""
     ></script>
   </body>
Diff for withRouter.html
@@ -43,7 +43,7 @@
         "props": { "pageProps": {} },
         "page": "/withRouter",
         "query": {},
-        "buildId": "qiSGzf_EiXhKzQNab3M65",
+        "buildId": "GGuOdIy_Kt2E8KYMsaRR9",
         "isFallback": false,
         "gip": true
       }
@@ -77,11 +77,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/qiSGzf_EiXhKzQNab3M65/_buildManifest.js"
+      src="/_next/static/GGuOdIy_Kt2E8KYMsaRR9/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/qiSGzf_EiXhKzQNab3M65/_ssgManifest.js"
+      src="/_next/static/GGuOdIy_Kt2E8KYMsaRR9/_ssgManifest.js"
       async=""
     ></script>
   </body>
Commit: afb571f

@ijjk
Copy link
Member

ijjk commented Mar 22, 2021

Stats from current PR

Default Server Mode (Decrease detected ✓)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 9.8s 9.8s -26ms
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Page Load Tests Overall decrease ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 1.713 1.828 ⚠️ +0.12
/ avg req/sec 1459.41 1367.85 ⚠️ -91.56
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.142 1.131 -0.01
/error-in-render avg req/sec 2188.71 2210.74 +22.03
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
677f882d2ed8..a2e7.js gzip 13.4 kB 13.4 kB
framework.HASH.js gzip 39 kB 39 kB
main-HASH.js gzip 7.14 kB 7.14 kB
webpack-HASH.js gzip 751 B 751 B
Overall change 60.3 kB 60.3 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB
Overall change 31.3 kB 31.3 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-fde3324..9dd1.js gzip 1.28 kB 1.28 kB
_error-af59f..582f.js gzip 3.46 kB 3.46 kB
amp-9716187d..0aa8.js gzip 536 B 536 B
hooks-107e90..74c7.js gzip 888 B 888 B
index-ac435c..ecf2.js gzip 227 B 227 B
link-e6cee42..49eb.js gzip 1.64 kB 1.64 kB
routerDirect..dc9d.js gzip 303 B 303 B
withRouter-6..0e02.js gzip 302 B 302 B
Overall change 8.64 kB 8.64 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 346 B 346 B
Overall change 346 B 346 B
Rendered Page Sizes
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 612 B 612 B
link.html gzip 621 B 621 B
withRouter.html gzip 608 B 608 B
Overall change 1.84 kB 1.84 kB

Serverless Mode
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 11.7s 11.5s -130ms
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
677f882d2ed8..a2e7.js gzip 13.4 kB 13.4 kB
framework.HASH.js gzip 39 kB 39 kB
main-HASH.js gzip 7.14 kB 7.14 kB
webpack-HASH.js gzip 751 B 751 B
Overall change 60.3 kB 60.3 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB
Overall change 31.3 kB 31.3 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-fde3324..9dd1.js gzip 1.28 kB 1.28 kB
_error-af59f..582f.js gzip 3.46 kB 3.46 kB
amp-9716187d..0aa8.js gzip 536 B 536 B
hooks-107e90..74c7.js gzip 888 B 888 B
index-ac435c..ecf2.js gzip 227 B 227 B
link-e6cee42..49eb.js gzip 1.64 kB 1.64 kB
routerDirect..dc9d.js gzip 303 B 303 B
withRouter-6..0e02.js gzip 302 B 302 B
Overall change 8.64 kB 8.64 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 346 B 346 B
Overall change 346 B 346 B
Serverless bundles
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_error.js 1.02 MB 1.02 MB
404.html 2.67 kB 2.67 kB
500.html 2.65 kB 2.65 kB
amp.amp.html 10.6 kB 10.6 kB
amp.html 1.86 kB 1.86 kB
hooks.html 1.92 kB 1.92 kB
index.js 1.02 MB 1.02 MB
link.js 1.08 MB 1.08 MB
routerDirect.js 1.07 MB 1.07 MB
withRouter.js 1.07 MB 1.07 MB
Overall change 5.27 MB 5.27 MB

Webpack 5 Mode (Decrease detected ✓)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 12.3s 11.8s -494ms
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Page Load Tests Overall decrease ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 1.741 1.841 ⚠️ +0.1
/ avg req/sec 1435.77 1357.96 ⚠️ -77.81
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.085 1.118 ⚠️ +0.03
/error-in-render avg req/sec 2304.91 2237.02 ⚠️ -67.89
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
597-12fee761..569d.js gzip 13.3 kB 13.3 kB
framework.HASH.js gzip 39.3 kB 39.3 kB
main-HASH.js gzip 7.11 kB 7.11 kB
webpack-HASH.js gzip 993 B 993 B
Overall change 60.7 kB 60.7 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.1 kB 31.1 kB
Overall change 31.1 kB 31.1 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-b5edc60..e5c2.js gzip 1.29 kB 1.29 kB
_error-b58c1..9b8e.js gzip 3.4 kB 3.4 kB
amp-89a5460c..567f.js gzip 558 B 558 B
hooks-8c2e74..be37.js gzip 924 B 924 B
index-fec729..83b2.js gzip 243 B 243 B
link-3631090..4cab.js gzip 1.65 kB 1.65 kB
routerDirect..20d7.js gzip 328 B 328 B
withRouter-b..a4b9.js gzip 326 B 326 B
Overall change 8.72 kB 8.72 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 325 B 325 B
Overall change 325 B 325 B
Rendered Page Sizes
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 585 B 585 B
link.html gzip 594 B 594 B
withRouter.html gzip 582 B 582 B
Overall change 1.76 kB 1.76 kB

Diffs

Diff for index.html
@@ -43,7 +43,7 @@
         "props": { "pageProps": {} },
         "page": "/",
         "query": {},
-        "buildId": "1F-mTUPGhtHabWo87QYGz",
+        "buildId": "sqizKp7sfecGU3yfRSt-T",
         "isFallback": false,
         "gip": true
       }
@@ -77,11 +77,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/1F-mTUPGhtHabWo87QYGz/_buildManifest.js"
+      src="/_next/static/sqizKp7sfecGU3yfRSt-T/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/1F-mTUPGhtHabWo87QYGz/_ssgManifest.js"
+      src="/_next/static/sqizKp7sfecGU3yfRSt-T/_ssgManifest.js"
       async=""
     ></script>
   </body>
Diff for link.html
@@ -48,7 +48,7 @@
         "props": { "pageProps": {} },
         "page": "/link",
         "query": {},
-        "buildId": "1F-mTUPGhtHabWo87QYGz",
+        "buildId": "sqizKp7sfecGU3yfRSt-T",
         "isFallback": false,
         "gip": true
       }
@@ -82,11 +82,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/1F-mTUPGhtHabWo87QYGz/_buildManifest.js"
+      src="/_next/static/sqizKp7sfecGU3yfRSt-T/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/1F-mTUPGhtHabWo87QYGz/_ssgManifest.js"
+      src="/_next/static/sqizKp7sfecGU3yfRSt-T/_ssgManifest.js"
       async=""
     ></script>
   </body>
Diff for withRouter.html
@@ -43,7 +43,7 @@
         "props": { "pageProps": {} },
         "page": "/withRouter",
         "query": {},
-        "buildId": "1F-mTUPGhtHabWo87QYGz",
+        "buildId": "sqizKp7sfecGU3yfRSt-T",
         "isFallback": false,
         "gip": true
       }
@@ -77,11 +77,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/1F-mTUPGhtHabWo87QYGz/_buildManifest.js"
+      src="/_next/static/sqizKp7sfecGU3yfRSt-T/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/1F-mTUPGhtHabWo87QYGz/_ssgManifest.js"
+      src="/_next/static/sqizKp7sfecGU3yfRSt-T/_ssgManifest.js"
       async=""
     ></script>
   </body>
Commit: e5edcfe

@ijjk
Copy link
Member

ijjk commented Mar 22, 2021

Failing test suites

Commit: e5edcfe

test/integration/link-with-encoding/test/index.test.js

  • Link Component with Encoding > spaces > should have correct query on SSR
Expand output

● Link Component with Encoding › spaces › should have correct query on SSR

NoSuchElementError: no such element: Unable to locate element: {"method":"css selector","selector":"#query-content"}
  (Session info: headless chrome=89.0.4389.90)

  26 |       )
  27 |       try {
> 28 |         const text = await browser.elementByCss('#query-content').text()
     |                      ^
  29 |         expect(text).toMatchInlineSnapshot(`"{\\"slug\\":\\"hello world \\"}"`)
  30 |       } finally {
  31 |         await browser.close()

  at Object.throwDecodedError (../node_modules/selenium-webdriver/lib/error.js:550:15)
  at parseHttpResponse (../node_modules/selenium-webdriver/lib/http.js:565:13)
  at Executor.execute (../node_modules/selenium-webdriver/lib/http.js:491:26)
  at thenableWebDriverProxy.execute (../node_modules/selenium-webdriver/lib/webdriver.js:700:17)
  at Object.<anonymous> (integration/link-with-encoding/test/index.test.js:28:22)

@ijjk
Copy link
Member

ijjk commented Mar 22, 2021

Stats from current PR

Default Server Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 13.4s 13.1s -268ms
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Page Load Tests Overall increase ✓
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 2.362 2.318 -0.04
/ avg req/sec 1058.63 1078.55 +19.92
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.744 1.676 -0.07
/error-in-render avg req/sec 1433.34 1491.42 +58.08
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
677f882d2ed8..a2e7.js gzip 13.4 kB 13.4 kB
framework.HASH.js gzip 39 kB 39 kB
main-HASH.js gzip 7.14 kB 7.14 kB
webpack-HASH.js gzip 751 B 751 B
Overall change 60.3 kB 60.3 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB
Overall change 31.3 kB 31.3 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-fde3324..9dd1.js gzip 1.28 kB 1.28 kB
_error-af59f..582f.js gzip 3.46 kB 3.46 kB
amp-9716187d..0aa8.js gzip 536 B 536 B
hooks-107e90..74c7.js gzip 888 B 888 B
index-ac435c..ecf2.js gzip 227 B 227 B
link-e6cee42..49eb.js gzip 1.64 kB 1.64 kB
routerDirect..dc9d.js gzip 303 B 303 B
withRouter-6..0e02.js gzip 302 B 302 B
Overall change 8.64 kB 8.64 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 346 B 346 B
Overall change 346 B 346 B
Rendered Page Sizes
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 612 B 612 B
link.html gzip 621 B 621 B
withRouter.html gzip 608 B 608 B
Overall change 1.84 kB 1.84 kB

Serverless Mode
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 15.1s 15.1s ⚠️ +77ms
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
677f882d2ed8..a2e7.js gzip 13.4 kB 13.4 kB
framework.HASH.js gzip 39 kB 39 kB
main-HASH.js gzip 7.14 kB 7.14 kB
webpack-HASH.js gzip 751 B 751 B
Overall change 60.3 kB 60.3 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB
Overall change 31.3 kB 31.3 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-fde3324..9dd1.js gzip 1.28 kB 1.28 kB
_error-af59f..582f.js gzip 3.46 kB 3.46 kB
amp-9716187d..0aa8.js gzip 536 B 536 B
hooks-107e90..74c7.js gzip 888 B 888 B
index-ac435c..ecf2.js gzip 227 B 227 B
link-e6cee42..49eb.js gzip 1.64 kB 1.64 kB
routerDirect..dc9d.js gzip 303 B 303 B
withRouter-6..0e02.js gzip 302 B 302 B
Overall change 8.64 kB 8.64 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 346 B 346 B
Overall change 346 B 346 B
Serverless bundles
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_error.js 1.02 MB 1.02 MB
404.html 2.67 kB 2.67 kB
500.html 2.65 kB 2.65 kB
amp.amp.html 10.6 kB 10.6 kB
amp.html 1.86 kB 1.86 kB
hooks.html 1.92 kB 1.92 kB
index.js 1.02 MB 1.02 MB
link.js 1.08 MB 1.08 MB
routerDirect.js 1.07 MB 1.07 MB
withRouter.js 1.07 MB 1.07 MB
Overall change 5.27 MB 5.27 MB

Webpack 5 Mode (Decrease detected ✓)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 15.4s 15.9s ⚠️ +490ms
nodeModulesSize 43.6 MB 43.6 MB ⚠️ +5.97 kB
Page Load Tests Overall decrease ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 2.43 2.472 ⚠️ +0.04
/ avg req/sec 1028.6 1011.17 ⚠️ -17.43
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.618 1.61 -0.01
/error-in-render avg req/sec 1544.87 1552.78 +7.91
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
597-12fee761..569d.js gzip 13.3 kB 13.3 kB
framework.HASH.js gzip 39.3 kB 39.3 kB
main-HASH.js gzip 7.11 kB 7.11 kB
webpack-HASH.js gzip 993 B 993 B
Overall change 60.7 kB 60.7 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.1 kB 31.1 kB
Overall change 31.1 kB 31.1 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-b5edc60..e5c2.js gzip 1.29 kB 1.29 kB
_error-b58c1..9b8e.js gzip 3.4 kB 3.4 kB
amp-89a5460c..567f.js gzip 558 B 558 B
hooks-8c2e74..be37.js gzip 924 B 924 B
index-fec729..83b2.js gzip 243 B 243 B
link-3631090..4cab.js gzip 1.65 kB 1.65 kB
routerDirect..20d7.js gzip 328 B 328 B
withRouter-b..a4b9.js gzip 326 B 326 B
Overall change 8.72 kB 8.72 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 325 B 325 B
Overall change 325 B 325 B
Rendered Page Sizes
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 585 B 585 B
link.html gzip 594 B 594 B
withRouter.html gzip 582 B 582 B
Overall change 1.76 kB 1.76 kB

Diffs

Diff for index.html
@@ -43,7 +43,7 @@
         "props": { "pageProps": {} },
         "page": "/",
         "query": {},
-        "buildId": "nYCLy5vJLstpyyklyU4WM",
+        "buildId": "NFeH6Jir66BW_l5io2kgA",
         "isFallback": false,
         "gip": true
       }
@@ -77,11 +77,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/nYCLy5vJLstpyyklyU4WM/_buildManifest.js"
+      src="/_next/static/NFeH6Jir66BW_l5io2kgA/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/nYCLy5vJLstpyyklyU4WM/_ssgManifest.js"
+      src="/_next/static/NFeH6Jir66BW_l5io2kgA/_ssgManifest.js"
       async=""
     ></script>
   </body>
Diff for link.html
@@ -48,7 +48,7 @@
         "props": { "pageProps": {} },
         "page": "/link",
         "query": {},
-        "buildId": "nYCLy5vJLstpyyklyU4WM",
+        "buildId": "NFeH6Jir66BW_l5io2kgA",
         "isFallback": false,
         "gip": true
       }
@@ -82,11 +82,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/nYCLy5vJLstpyyklyU4WM/_buildManifest.js"
+      src="/_next/static/NFeH6Jir66BW_l5io2kgA/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/nYCLy5vJLstpyyklyU4WM/_ssgManifest.js"
+      src="/_next/static/NFeH6Jir66BW_l5io2kgA/_ssgManifest.js"
       async=""
     ></script>
   </body>
Diff for withRouter.html
@@ -43,7 +43,7 @@
         "props": { "pageProps": {} },
         "page": "/withRouter",
         "query": {},
-        "buildId": "nYCLy5vJLstpyyklyU4WM",
+        "buildId": "NFeH6Jir66BW_l5io2kgA",
         "isFallback": false,
         "gip": true
       }
@@ -77,11 +77,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/nYCLy5vJLstpyyklyU4WM/_buildManifest.js"
+      src="/_next/static/NFeH6Jir66BW_l5io2kgA/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/nYCLy5vJLstpyyklyU4WM/_ssgManifest.js"
+      src="/_next/static/NFeH6Jir66BW_l5io2kgA/_ssgManifest.js"
       async=""
     ></script>
   </body>
Commit: fe3cede

@kachkaev
Copy link
Contributor

kachkaev commented Mar 24, 2021

This is a very important addition for many folks including those using ant-design.
Because @zeit/next-less@0.3.1-canary.4 is two years old and webpack 5 is close to become a default version, it’s getting more and more challenging to stick with the pre-existing app setup.

@vbudovski have you experimented with antd in your branch?

@vbudovski
Copy link
Author

This is a very important addition for many folks including those using ant-design.
Because @zeit/next-less@0.3.1-canary.4 is two years old and webpack 5 is close to become a default version, it’s getting more and more challenging to stick with the pre-existing app setup.

@vbudovski have you experimented with antd in your branch?

@kachkaev Yes, that was my primary motivation for adding less support to NextJS. Works well for me.

@ijjk
Copy link
Member

ijjk commented Mar 30, 2021

Stats from current PR

Default Server Mode (Decrease detected ✓)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 10s 10s -37ms
nodeModulesSize 45.9 MB 45.9 MB ⚠️ +5.97 kB
Page Load Tests Overall decrease ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 1.749 1.717 -0.03
/ avg req/sec 1429.48 1455.78 +26.3
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.033 1.072 ⚠️ +0.04
/error-in-render avg req/sec 2421.21 2333.1 ⚠️ -88.11
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
677f882d2ed8..7edd.js gzip 13.4 kB 13.4 kB
framework.HASH.js gzip 39 kB 39 kB
main-HASH.js gzip 7.12 kB 7.12 kB
webpack-HASH.js gzip 751 B 751 B
Overall change 60.2 kB 60.2 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB
Overall change 31.3 kB 31.3 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-8fbabfc..6440.js gzip 1.28 kB 1.28 kB
_error-af59f..582f.js gzip 3.46 kB 3.46 kB
amp-9716187d..0aa8.js gzip 536 B 536 B
hooks-107e90..74c7.js gzip 888 B 888 B
index-ac435c..ecf2.js gzip 227 B 227 B
link-c31053f..c329.js gzip 1.64 kB 1.64 kB
routerDirect..dc9d.js gzip 303 B 303 B
withRouter-6..0e02.js gzip 302 B 302 B
Overall change 8.64 kB 8.64 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 370 B 370 B
Overall change 370 B 370 B
Rendered Page Sizes
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 612 B 612 B
link.html gzip 620 B 620 B
withRouter.html gzip 607 B 607 B
Overall change 1.84 kB 1.84 kB

Serverless Mode
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 11.6s 11.7s ⚠️ +108ms
nodeModulesSize 45.9 MB 45.9 MB ⚠️ +5.97 kB
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
677f882d2ed8..7edd.js gzip 13.4 kB 13.4 kB
framework.HASH.js gzip 39 kB 39 kB
main-HASH.js gzip 7.12 kB 7.12 kB
webpack-HASH.js gzip 751 B 751 B
Overall change 60.2 kB 60.2 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB
Overall change 31.3 kB 31.3 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-8fbabfc..6440.js gzip 1.28 kB 1.28 kB
_error-af59f..582f.js gzip 3.46 kB 3.46 kB
amp-9716187d..0aa8.js gzip 536 B 536 B
hooks-107e90..74c7.js gzip 888 B 888 B
index-ac435c..ecf2.js gzip 227 B 227 B
link-c31053f..c329.js gzip 1.64 kB 1.64 kB
routerDirect..dc9d.js gzip 303 B 303 B
withRouter-6..0e02.js gzip 302 B 302 B
Overall change 8.64 kB 8.64 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 370 B 370 B
Overall change 370 B 370 B
Serverless bundles
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_error.js 1.36 MB 1.36 MB
404.html 2.67 kB 2.67 kB
500.html 2.65 kB 2.65 kB
amp.amp.html 10.6 kB 10.6 kB
amp.html 1.86 kB 1.86 kB
hooks.html 1.92 kB 1.92 kB
index.js 1.36 MB 1.36 MB
link.js 1.42 MB 1.42 MB
routerDirect.js 1.41 MB 1.41 MB
withRouter.js 1.41 MB 1.41 MB
Overall change 6.99 MB 6.99 MB

Webpack 5 Mode (Increase detected ⚠️)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 12s 11.9s -78ms
nodeModulesSize 45.9 MB 45.9 MB ⚠️ +5.97 kB
Page Load Tests Overall increase ✓
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 1.741 1.715 -0.03
/ avg req/sec 1435.69 1457.86 +22.17
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.072 1.065 -0.01
/error-in-render avg req/sec 2332.45 2346.94 +14.49
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
597-e27c5352..db8c.js gzip 13.3 kB 13.3 kB
778-a4568938..e1f5.js gzip 7.04 kB 7.04 kB
framework.HASH.js gzip 39.3 kB 39.3 kB
main-HASH.js gzip 151 B 151 B
webpack-HASH.js gzip 993 B 993 B
Overall change 60.8 kB 60.8 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.1 kB 31.1 kB
Overall change 31.1 kB 31.1 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-5cc66b2..6f03.js gzip 1.3 kB 1.3 kB
_error-b58c1..9b8e.js gzip 3.4 kB 3.4 kB
amp-89a5460c..567f.js gzip 558 B 558 B
hooks-8c2e74..be37.js gzip 924 B 924 B
index-fec729..83b2.js gzip 243 B 243 B
link-dd34d9b..0ade.js gzip 1.66 kB 1.66 kB
routerDirect..5759.js gzip 336 B 336 B
withRouter-1..98bf.js gzip 334 B 334 B
Overall change 8.76 kB 8.76 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 349 B 349 B
Overall change 349 B 349 B
Rendered Page Sizes
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 610 B 610 B
link.html gzip 616 B 616 B
withRouter.html gzip 604 B 604 B
Overall change 1.83 kB 1.83 kB

Diffs

Diff for index.html
@@ -43,7 +43,7 @@
         "props": { "pageProps": {} },
         "page": "/",
         "query": {},
-        "buildId": "V77Q-M_ycnpWq-27s5VYG",
+        "buildId": "7BYgqB41xLoskSSjk4WMw",
         "isFallback": false,
         "gip": true
       }
@@ -77,11 +77,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/V77Q-M_ycnpWq-27s5VYG/_buildManifest.js"
+      src="/_next/static/7BYgqB41xLoskSSjk4WMw/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/V77Q-M_ycnpWq-27s5VYG/_ssgManifest.js"
+      src="/_next/static/7BYgqB41xLoskSSjk4WMw/_ssgManifest.js"
       async=""
     ></script>
   </body>
Diff for link.html
@@ -48,7 +48,7 @@
         "props": { "pageProps": {} },
         "page": "/link",
         "query": {},
-        "buildId": "V77Q-M_ycnpWq-27s5VYG",
+        "buildId": "7BYgqB41xLoskSSjk4WMw",
         "isFallback": false,
         "gip": true
       }
@@ -82,11 +82,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/V77Q-M_ycnpWq-27s5VYG/_buildManifest.js"
+      src="/_next/static/7BYgqB41xLoskSSjk4WMw/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/V77Q-M_ycnpWq-27s5VYG/_ssgManifest.js"
+      src="/_next/static/7BYgqB41xLoskSSjk4WMw/_ssgManifest.js"
       async=""
     ></script>
   </body>
Diff for withRouter.html
@@ -43,7 +43,7 @@
         "props": { "pageProps": {} },
         "page": "/withRouter",
         "query": {},
-        "buildId": "V77Q-M_ycnpWq-27s5VYG",
+        "buildId": "7BYgqB41xLoskSSjk4WMw",
         "isFallback": false,
         "gip": true
       }
@@ -77,11 +77,11 @@
       async=""
     ></script>
     <script
-      src="/_next/static/V77Q-M_ycnpWq-27s5VYG/_buildManifest.js"
+      src="/_next/static/7BYgqB41xLoskSSjk4WMw/_buildManifest.js"
       async=""
     ></script>
     <script
-      src="/_next/static/V77Q-M_ycnpWq-27s5VYG/_ssgManifest.js"
+      src="/_next/static/7BYgqB41xLoskSSjk4WMw/_ssgManifest.js"
       async=""
     ></script>
   </body>
Commit: df4d662

@ijjk
Copy link
Member

ijjk commented Apr 22, 2021

Stats from current PR

Default Server Mode (Decrease detected ✓)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 16.7s 16.6s -98ms
buildDurationCached 5.5s 5s -446ms
nodeModulesSize 46.6 MB 46.6 MB ⚠️ +5.97 kB
Page Load Tests Overall decrease ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 2.878 2.839 -0.04
/ avg req/sec 868.66 880.67 +12.01
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.661 1.676 ⚠️ +0.01
/error-in-render avg req/sec 1505.27 1491.34 ⚠️ -13.93
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
597-HASH.js gzip 13.3 kB 13.3 kB
778-HASH.js gzip 7.12 kB 7.12 kB
framework-HASH.js gzip 39.3 kB 39.3 kB
main-HASH.js gzip 151 B 151 B
webpack-HASH.js gzip 993 B 993 B
Overall change 60.8 kB 60.8 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.1 kB 31.1 kB
Overall change 31.1 kB 31.1 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-HASH.js gzip 1.3 kB 1.3 kB
_error-HASH.js gzip 3.68 kB 3.68 kB
amp-HASH.js gzip 558 B 558 B
css-HASH.js gzip 363 B 363 B
hooks-HASH.js gzip 924 B 924 B
index-HASH.js gzip 243 B 243 B
link-HASH.js gzip 1.66 kB 1.66 kB
routerDirect..HASH.js gzip 336 B 336 B
withRouter-HASH.js gzip 334 B 334 B
99a142a5cfae..804.css gzip 125 B 125 B
Overall change 9.52 kB 9.52 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 390 B 390 B
Overall change 390 B 390 B
Rendered Page Sizes Overall decrease ✓
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 609 B 609 B
link.html gzip 615 B 614 B -1 B
withRouter.html gzip 604 B 604 B
Overall change 1.83 kB 1.83 kB -1 B

Diffs

Diff for index.html
@@ -7,7 +7,7 @@
     <noscript data-n-css=""></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/webpack-cb3e79d84e65ca7a49d8.js"
+      href="/_next/static/chunks/webpack-f8f7f105ededb664242e.js"
       as="script"
     />
     <link
@@ -58,7 +58,7 @@
       src="/_next/static/chunks/polyfills-8683bd742a84c1edd48c.js"
     ></script>
     <script
-      src="/_next/static/chunks/webpack-cb3e79d84e65ca7a49d8.js"
+      src="/_next/static/chunks/webpack-f8f7f105ededb664242e.js"
       async=""
     ></script>
     <script
Diff for link.html
@@ -7,7 +7,7 @@
     <noscript data-n-css=""></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/webpack-cb3e79d84e65ca7a49d8.js"
+      href="/_next/static/chunks/webpack-f8f7f105ededb664242e.js"
       as="script"
     />
     <link
@@ -63,7 +63,7 @@
       src="/_next/static/chunks/polyfills-8683bd742a84c1edd48c.js"
     ></script>
     <script
-      src="/_next/static/chunks/webpack-cb3e79d84e65ca7a49d8.js"
+      src="/_next/static/chunks/webpack-f8f7f105ededb664242e.js"
       async=""
     ></script>
     <script
Diff for withRouter.html
@@ -7,7 +7,7 @@
     <noscript data-n-css=""></noscript>
     <link
       rel="preload"
-      href="/_next/static/chunks/webpack-cb3e79d84e65ca7a49d8.js"
+      href="/_next/static/chunks/webpack-f8f7f105ededb664242e.js"
       as="script"
     />
     <link
@@ -58,7 +58,7 @@
       src="/_next/static/chunks/polyfills-8683bd742a84c1edd48c.js"
     ></script>
     <script
-      src="/_next/static/chunks/webpack-cb3e79d84e65ca7a49d8.js"
+      src="/_next/static/chunks/webpack-f8f7f105ededb664242e.js"
       async=""
     ></script>
     <script

Serverless Mode
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 20.4s 20.7s ⚠️ +270ms
buildDurationCached 7.6s 7.6s -35ms
nodeModulesSize 46.6 MB 46.6 MB ⚠️ +5.97 kB
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
597-HASH.js gzip 13.3 kB 13.3 kB
778-HASH.js gzip 7.12 kB 7.12 kB
framework-HASH.js gzip 39.3 kB 39.3 kB
main-HASH.js gzip 151 B 151 B
webpack-HASH.js gzip 993 B 993 B
Overall change 60.8 kB 60.8 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.1 kB 31.1 kB
Overall change 31.1 kB 31.1 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-HASH.js gzip 1.3 kB 1.3 kB
_error-HASH.js gzip 3.68 kB 3.68 kB
amp-HASH.js gzip 558 B 558 B
css-HASH.js gzip 363 B 363 B
hooks-HASH.js gzip 924 B 924 B
index-HASH.js gzip 243 B 243 B
link-HASH.js gzip 1.66 kB 1.66 kB
routerDirect..HASH.js gzip 336 B 336 B
withRouter-HASH.js gzip 334 B 334 B
99a142a5cfae..804.css gzip 125 B 125 B
Overall change 9.52 kB 9.52 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 390 B 390 B
Overall change 390 B 390 B
Serverless bundles
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_error.js 1.39 MB 1.39 MB
404.html 2.76 kB 2.76 kB
500.html 2.75 kB 2.75 kB
amp.amp.html 10.8 kB 10.8 kB
amp.html 1.96 kB 1.96 kB
css.html 2.13 kB 2.13 kB
hooks.html 2.01 kB 2.01 kB
index.js 1.39 MB 1.39 MB
link.js 1.45 MB 1.45 MB
routerDirect.js 1.44 MB 1.44 MB
withRouter.js 1.44 MB 1.44 MB
Overall change 7.15 MB 7.15 MB

Webpack 4 Mode (Decrease detected ✓)
General Overall increase ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
buildDuration 13.9s 13.8s -145ms
buildDurationCached 5.9s 5.7s -250ms
nodeModulesSize 46.6 MB 46.6 MB ⚠️ +5.97 kB
Page Load Tests Overall decrease ⚠️
vercel/next.js canary vbudovski/next.js feature/less-styles Change
/ failed reqs 0 0
/ total time (seconds) 2.797 2.875 ⚠️ +0.08
/ avg req/sec 893.91 869.64 ⚠️ -24.27
/error-in-render failed reqs 0 0
/error-in-render total time (seconds) 1.65 1.627 -0.02
/error-in-render avg req/sec 1515.17 1536.74 +21.57
Client Bundles (main, webpack, commons)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
677f882d2ed8..HASH.js gzip 13.4 kB 13.4 kB
framework.HASH.js gzip 39 kB 39 kB
main-HASH.js gzip 7.2 kB 7.2 kB
webpack-HASH.js gzip 751 B 751 B
Overall change 60.3 kB 60.3 kB
Legacy Client Bundles (polyfills)
vercel/next.js canary vbudovski/next.js feature/less-styles Change
polyfills-HASH.js gzip 31.3 kB 31.3 kB
Overall change 31.3 kB 31.3 kB
Client Pages
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_app-HASH.js gzip 1.28 kB 1.28 kB
_error-HASH.js gzip 3.71 kB 3.71 kB
amp-HASH.js gzip 536 B 536 B
css-HASH.js gzip 339 B 339 B
hooks-HASH.js gzip 887 B 887 B
index-HASH.js gzip 227 B 227 B
link-HASH.js gzip 1.65 kB 1.65 kB
routerDirect..HASH.js gzip 303 B 303 B
withRouter-HASH.js gzip 302 B 302 B
21c68fa65a48..217.css gzip 125 B 125 B
Overall change 9.36 kB 9.36 kB
Client Build Manifests
vercel/next.js canary vbudovski/next.js feature/less-styles Change
_buildManifest.js gzip 419 B 419 B
Overall change 419 B 419 B
Rendered Page Sizes
vercel/next.js canary vbudovski/next.js feature/less-styles Change
index.html gzip 611 B 611 B
link.html gzip 620 B 620 B
withRouter.html gzip 605 B 605 B
Overall change 1.84 kB 1.84 kB
Commit: d3e3f28

{
loader: 'less-loader',
options: {
sourceMap: true,

Choose a reason for hiding this comment

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

source-map should be depended on user parameters.

@mattlubner
Copy link

mattlubner commented Jul 28, 2021

Adding Less support would make optimizations like https://twitter.com/shuding_/status/1378086219708473344 significantly more difficult as it would be yet another constraint to account for.

@timneutkens I can understand the reasoning behind not wanting to support yet another feature in Next.js. However, supporting Less out of the box would make Next.js more compatible with UI frameworks like Ant.Design (which only export their styles as Less).

In the case of Ant.Design, it would also make Next.js more performant.

Perhaps you'll reconsider?

A few relevant points:

  1. Using Ant.Design with Next.js forces a choice between performance or convenience – either (a) add Less support to Next.js yourself (the antd babel plugin should tree-shake modules which import unneeded *.less files), or (b) import the precompiled global antd CSS stylesheet (and incur the load-time performance penalty)
  2. Writing a custom Ant.Design theme requires importing their Less files
  3. The Ant.Design team has been resistant to several past suggestions to switch away from using Less (understandable – it would involve a lot of work for them)
  4. Ant.Design's popularity continues to grow… and so too does the number of developers affected by this issue! 😅
  5. Using stats cited earlier in this thread, Less is used either directly or indirectly by somewhere between 9.08% – 13.83% of Next.js apps

It's probably worth noting that I'm typically a steadfast advocate of CSS-in-JS approaches. However, I'm advocating for Less support here as a pragmatic solution to improving the performance and themeability of Ant.Design when used along with Next.js.

(Aside: Here are some interesting stats on UI framework popularity, as contrasted with both Next.js and Gatsby)

@StKostyantin
Copy link

Adding Less support would make optimizations like https://twitter.com/shuding_/status/1378086219708473344 significantly more difficult as it would be yet another constraint to account for.

@timneutkens I can understand the reasoning behind not wanting to support yet another feature in Next.js. However, supporting Less out of the box would make Next.js more compatible with UI frameworks like Ant.Design (which only export their styles as Less).

In the case of Ant.Design, it would also make Next.js more performant.

Perhaps you'll reconsider?

A few relevant points:

1. Using Ant.Design with Next.js forces a choice between performance or convenience – either (a) add Less support to Next.js yourself (the [antd babel plugin](https://github.com/ant-design/babel-plugin-import) should tree-shake modules which import unneeded `*.less` files), or (b) import the precompiled global antd CSS stylesheet (and incur the load-time performance penalty)

2. Writing a custom Ant.Design theme _requires_ importing their Less files

3. The Ant.Design team has been resistant to several past suggestions to switch away from using Less (understandable – it would involve _a lot_ of work for them)

4. Ant.Design's popularity continues to grow… and so too does the number of developers affected by this issue! 😅

5. Using stats cited [earlier](https://github.com/vercel/next.js/pull/23185#pullrequestreview-647986468) in this thread, Less is used either _directly or indirectly_ by somewhere between 9.08% – 13.83% of Next.js apps

It's probably worth noting that I'm typically a steadfast advocate of CSS-in-JS approaches. However, I'm advocating for Less support here as a pragmatic solution to improving the performance and themeability of Ant.Design when used along with Next.js.

(Aside: Here are some interesting stats on UI framework popularity, as contrasted with both Next.js and Gatsby)

I would like to add that if you do not do full support out of the box, then create an official package for working with Ant.Design. with future compatibility, and where people could contribute

@mohas
Copy link

mohas commented Jul 28, 2021

Ant has reached a point where it cannot be ignored, unfortunately they offer very little customisation options , the only reaonable way to customise it is via supporting less transpiling and overriding variables

@neenhouse
Copy link

We're also interested in LESS support with nextJS. Currently, we are in an early phase of adoption with a size-able pre-existing base written in .less files. Not being able to import / use *.less with nextJS would be a significant friction point for adoption (IE, we want to re-use our currently existing styles in the new nextJS project).

@nicholasdgoodman
Copy link

Well several months after initially thinking this was going to be an issue and looking into various 3rd party solutions for this, we have simply decided to take on disabling "built-in CSS support" from Vercel / Next.js.

Our decision to use Next in the first place was about the opinionated, and useful file-based routing system and /api route simulation for local development. In production we only leverage the SSG capability of Next.

Our code base is shared by multiple webpack / build chains, so interoperability and code re-use trumps any concerns about bundle efficiency and page load times -- the app is fast enough.

One other big perk is we can break other "opinionated rules" enforced by Next: I can import global CSS files anywhere I want! 💥

The config change is fairly simple and vanilla for CSS / CSS Modules / LESS support all in one:
(using Next v12, Webpack 5, AntD 4.17, CSS Loader 5.1.3, Less Loader 8.1.1)

next.config.js

config.module.rules.push({
    test: /\.(css)$/,
    use: [
        MiniCssExtractPlugin.loader,
        'css-loader'
    ]
},
{
    test: /\.(less)$/,
    use: [
        MiniCssExtractPlugin.loader,
        'css-loader',
        {
            loader: 'less-loader',
            options: {
                lessOptions: {
                    javascriptEnabled: true,
                    math: 'always'
                }
            }
        }
    ]
});

config.plugins.push(new MiniCssExtractPlugin({
    filename: 'static/[name].css'     // this is the secret sauce to play nice with the Next dev server
}));

Both local development and our SSG output appears perfectly functional with this configuration, and our AntD components are looking mighty fine (huge CSS bundles though! -- I blame Ant)

I wonder if there's any way to hide this warning? 🤔

Warning: Built-in CSS support is being disabled due to custom CSS configuration being detected.

@mkhotib20

This comment was marked as off-topic.

@ijjk ijjk force-pushed the canary branch 3 times, most recently from df8579c to 47e5ebe Compare October 25, 2022 16:15
@ijjk ijjk force-pushed the canary branch 2 times, most recently from e078ebe to 6b863fe Compare December 2, 2022 05:49
@ijjk ijjk requested a review from a team as a code owner May 4, 2023 16:19
@timneutkens
Copy link
Member

Thanks everyone for the thoughtful comments here. Unfortunately, after discussing with the team once more, we're even more convicted that we cannot increase surface area with built-in support for Less, so I'm going to close this PR once again.

While I understand the workarounds are not ideal for the folks who are depending on Ant Design, we have to weigh tradeoffs when we consider each addition, and in this case, the benefits really don't outweigh the costs.

We'd love to see Ant Design make some tweaks to their outputs in order to make it easier to use Ant Design with Next.js, but for now, it's best to continue to work around this limitation in your own codebase.

@timneutkens timneutkens closed this May 9, 2023
@madmed88
Copy link
Contributor

madmed88 commented May 9, 2023 via email

@timneutkens
Copy link
Member

That's great to hear, thanks for sharing @madmed88.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Jun 10, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet