Comments (6)
Hello guys,
Please share your thoughts and concerns about this idea.
As a starter, here is the main value points and the concerns as I see it:
Value to the readers
they can experiment with the code snippets without having to leave the page.
Concerns
the size of the javascript files:
- klipse plugin: 1.1 MB, 224KB zipped
- babel: 1.4 MB, 459 KB zipped
- codemirror: a few KBs
from react.dev.
Those file sizes are valid concerns certainly. I think we could potentially do some things to mitigate them. On the Babel REPL (source code here) we do a couple of things to help with this:
- Load all big libs (eg Babel, big plug-ins) from CDN to benefit from browser cache.
- Defer loading any plug-ins until needed.
- Load them into a web-worker context so that compilation doesn't slow down the UI thread.
from react.dev.
Before reducing the footprint, would you like to give it a try on one or two pages of the react documentation and feel how it feels both on desktop and on mobile?
from react.dev.
I think it would be reasonable to put together a minimal proof-of-concept to see how the UX was before we worry too much about performance optimizations, sure.
from react.dev.
Hello guys,
I've been working on an integration of Klipse using [gatsby-plugin-klipse] (https://github.com/ahmedelgabri/gatsby-plugin-klipse) written by @ahmedelgabri. Here is the Work-In-Progress pull request #236
Let's continue the discussion there.
from react.dev.
I'm going to close this issue for now, for the reasons I mentioned in my comment on PR #236. I'm happy to keep talking about and re-evaluate any new ideas of proofs of concept though! ❤️
from react.dev.
Related Issues (20)
- Not Found
- [Bug]: the hydrate-mismatch link seems not right HOT 4
- GENERATE_SOURCEMAP=false Issue HOT 1
- Worflow Automator Issues
- [Bug]: Excessive Requests for Page Data - Why Does This Happen?
- links to "use server" and "use client" docs are broken on directive page docs
- directives page is not found HOT 1
- 'use server' reference page does not exist in the doc HOT 1
- [Suggestion]: Add tsconfig.json update to React 19 upgrade guide HOT 8
- Use-server documentation URL broken HOT 2
- references/react-dom/components/button link in 20240425 blog post results to Not Found page HOT 2
- [Typo]: No mention of isPending in return values of useActionState
- [Typo]: 选择stat结构所给答案错误 HOT 1
- [Typo]: In code example of server actions
- [Bug]: Visual bug on main page
- flipksrrt
- single-file-example.html link broken HOT 6
- [Typo]: Cannot debug the react source code through 'babel-standalone/dev.html' file HOT 2
- [Bug]: missing redirect for feed.xml HOT 2
- [Suggestion]: Start a New React Project page should tell you how to start a new react project HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react.dev.