[docs-infra] StackBlitz WebContainer demos #45924
Conversation
Janpot
added
docs
Netlify deploy previewhttps://deploy-preview-45924--material-ui.netlify.app/ Bundle size report |
| @@ -1,99 +1,202 @@ | |||
| import addHiddenInput from 'docs/src/modules/utils/addHiddenInput'; | |||
| import { CODE_VARIANTS } from 'docs/src/modules/constants'; | |||
| import sdk from '@stackblitz/sdk'; | |||
There was a problem hiding this comment.
Is this worth 3KB gzipped? https://bundlephobia.com/package/@stackblitz/sdk@1.11.0 What complexity does it solve that we really need this for? I mean what's wrong with making a call to the HTTP API ourselves directly?
There was a problem hiding this comment.
So the source looks simple https://github.com/stackblitz/sdk/blob/614e61fe8f50c419ed8414024899e37e69b1f999/src/generate.ts#L89. Maybe it does tree-shake correctly? But it doesn't seem to https://bundlejs.com/?q=%40stackblitz%2Fsdk%401.11.0&treeshake=%5B*%5D&text=%22export+default+sdk.openProject%3B%22
There was a problem hiding this comment.
I removed the sdk again. We're downloading 3MB of resources on initial load so optimizing for 2.5kB is not really going to be noticable 😬 but it's the principle.
There was a problem hiding this comment.
We're downloading 3MB of resources on initial load
Gzipped? Oh wow, probably part of why the docs is so slow now 🙃. I recall a time where every byte had to fight for its place on the bundle 😁. I will look a bit closer at this.
There was a problem hiding this comment.
yep, it's on my radar as well now. hopefully something the new code infra role can look into as well.
| </IconButton> | ||
| </DemoTooltip> | ||
| <DemoTooltip title={t('codesandbox')} placement="bottom"> | ||
| <IconButton |
There was a problem hiding this comment.
Why remove codesandbox?
- https://pro.similarweb.com/#/digitalsuite/websiteanalysis/overview/website-performance/*/999/1m?webSource=Total&key=codesandbox.io,stackblitz.com
- https://analytics.google.com/analytics/web/?authuser=1#/analysis/p353089763/edit/KctZ977QSou7VoMyBQMaqw
It looks like the majority of our users go with codesandbox.
There was a problem hiding this comment.
Why remove codesandbox?
It's broken. And it doesn't look like they prioritize at all. I'm bringing back the codesandboxes, we can discuss removing it separately.
It looks like the majority of our users go with codesandbox.
The numbers may also be a bit skewed as in some places in the docs there is only codesandbox available (e.g. joy templates)
There was a problem hiding this comment.
I brought back codesandbox, we can discuss removing it separately
Introduce demo/template sandboxes based on StackBlitz WebContainers so that they run real vite applications. I'm removing the old stackblitz links and codesandbox links as they are obsolete now and too unstable.
Advantages:
Disadvatages:
Try it out on https://deploy-preview-45924--material-ui.netlify.app/material-ui/react-button/
verified: