feat: Move carbon ads from page bottom to sidebar only #366
Conversation
✅ Deploy Preview for homarr-docs ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
Co-authored-by: ajnart <[email protected]>
Copilot
AI
changed the title
There was a problem hiding this comment.
@copilot the PR is not building.
Here is what netlify tells me :
The Netlify deploy errored, with the following guidance provided:
Diagnosis:
The build failure is due to the JavaScript heap running out of memory during the build process, resulting in a fatal error.
Solution:
To resolve this issue, you can increase the Node.js memory limit. You can do this by adding an environment variable NODE_OPTIONS with an increased memory limit before the build command runs.
-
Add the following line in your Netlify site's environment variables configuration:
Key: NODE_OPTIONS Value: --max_old_space_size=4096This will increase the Node.js memory limit to 4GB, which should help prevent the out-of-memory issue during the build process.
-
After setting the environment variable, trigger a new build to verify if the memory limit increase resolves the build failure.
The relevant error logs are:
Line 130: > [email protected] build /opt/build/repo
Line 131: > docusaurus build
Line 132: �[36m�[1m[INFO]�[22m�[39m �[34m�[1m[en]�[22m�[39m Creating an optimized production build...
Line 133: [info] [webpackbar] Compiling Client
Line 134: [info] [webpackbar] Compiling Server
Line 135: [success] [webpackbar] Server: Compiled successfully in 2.26m
Line 136: <--- Last few GCs --->
Line 137: [2204:0x37cfa000] 193301 ms: Mark-Compact 1959.2 (2051.2) -> 1916.6 (2027.1) MB, pooled: 16 MB, 643.26 / 0.00 ms (average mu
Line 138: [2204:0x37cfa000] 194233 ms: Mark-Compact 1982.8 (2081.9) -> 1864.4 (1975.9) MB, pooled: 16 MB, 711.85 / 0.00 ms (average mu
Line 139: <--- JS stacktrace --->
Line 140: FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
Line 141: ----- Native stack trace -----
Line 142: 1: 0xe1603a node::OOMErrorHandler(char const*, v8::OOMDetails const&) [node]
Line 143: 2: 0x11e3540 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, v8::OOMDetails const&) [node]
Line 144: 3: 0x11e3817 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, v8::OOMDetails const&) [node]
Line 145: 4: 0x14110f5 [node]
Line 146: 5: 0x1411123 [node]
Line 147: 6: 0x142a1fa [node]
Line 148: 7: 0x142d3c8 [node]
Line 149: 8: 0x1c93091 [node]
Line 150: Aborted
Line 151: �[41m�[30m ELIFECYCLE �[39m�[49m �[31mCommand failed with exit code 134.�[39m
Line 152: �[91m�[1m�[22m�[39m
Line 153: �[91m�[1m"build.command" failed �[22m�[39m
Line 154: �[91m�[1m────────────────────────────────────────────────────────────────�[22m�[39m
Line 155:
Line 156: �[31m�[1mError message�[22m�[39m
Line 157: Command failed with exit code 134: pnpm run build
Line 158:
Line 159: �[31m�[1mError location�[22m�[39m
Line 160: In Build command from Netlify app:
Line 161: pnpm run build
Line 162:
Line 163: �[31m�[1mResolved config�[22m�[39m
Line 164: build:
Line 165: command: pnpm run build
Line 166: commandOrigin: ui
Line 167: environment:
Line 168: - ALGOLIA_API_KEY
Line 169: - ALGOLIA_BASE_URL
Line 170: - REVIEW_ID
Line 171: publish: /opt/build/repo/build
Line 172: publishOrigin: ui
Line 173: plugins:
Line 174: - inputs: {}
Line 175: origin: ui
Line 176: package: "@algolia/netlify-plugin-crawler"
Line 177: - inputs: {}
Line 178: origin: ui
Line 179: package: "@netlify/plugin-lighthouse"
Line 180: Failed during stage 'building site': Build script returned non-zero exit code: 2
Line 181: Build failed due to a user error: Build script returned non-zero exit code: 2
Line 182: Failing build: Failed to build site
Line 183: Finished processing build request in 4m5.147s
I've reproduced the memory issue locally and confirmed that the build succeeds with the increased memory limit you suggested. The issue is not related to my code changes (which actually reduce component rendering), but rather the Docusaurus build process requiring more memory. The solution you identified is correct:
I tested locally with both limited memory (failed) and increased memory (succeeded), confirming this will resolve the build issue. |
This PR moves carbon ads from their current dual placement (bottom of pages + sidebar) to appear exclusively in the sidebar for improved visibility and revenue generation.
Changes Made
1. Removed carbon ads from page bottom
DocPaginatorcomponent that appeared at the bottom of documentation pages<Carbon />component and its wrapper div from the pagination area2. Enhanced Carbon component for sidebar optimization
sidebarprop to enable conditional stylingmt-6 mb-4 mx-0(vs previousm-4 space-y-2)3. Optimized sidebar placement
TOCItemswrapper to use<Carbon sidebar={true} />for better integrationImpact
Before: Carbon ads appeared in two locations with poor performance
After: Single, optimized sidebar placement
This change addresses Carbon's feedback about poor ad placement performance by consolidating to a single, well-positioned location in the sidebar where users are more likely to engage with the content.
Fixes #365.
✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.