feat(react): introduce @lynx-js/react/debug#1250
Conversation
🦋 Changeset detectedLatest commit: 1dc889d The changes in this PR will be included in the next version bump. This PR includes changesets to release 6 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
CodSpeed Performance ReportMerging #1250 will not alter performanceComparing Summary
|
Web Explorer#2714 Bundle Size — 259.2KiB (0%).1dc889d(current) vs b0765ae main#2703(baseline) Bundle metrics
Bundle size by type
|
| Current #2714 |
Baseline #2703 |
|
|---|---|---|
227.32KiB |
227.32KiB |
|
31.88KiB |
31.88KiB |
Bundle analysis report Branch colinaaa:colin/0708/debug Project dashboard
Generated by RelativeCI Documentation Report issue
React Example#2723 Bundle Size — 234.18KiB (+0.03%).1dc889d(current) vs b0765ae main#2712(baseline) Bundle metrics
Bundle size by type
Bundle analysis report Branch colinaaa:colin/0708/debug Project dashboard Generated by RelativeCI Documentation Report issue |
|
bugbot run |
There was a problem hiding this comment.
✅ BugBot reviewed your changes and found no bugs!
BugBot free trial expires on July 22, 2025
You have used $0.00 of your $0.00 spend limit so far. Manage your spend limit in the Cursor dashboard.
Was this report helpful? Give feedback by reacting with 👍 or 👎
upupming
left a comment
There was a problem hiding this comment.
Do we need some test case to ensure preact/debug work as expected?
This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @lynx-js/react@0.111.2 ### Patch Changes - Optimize `componentAtIndex` by a few hundreds microseconds: avoiding manipulate `__pendingListUpdates` unless SnapshotInstance tree is changed ([#1201](#1201)) - Support alog of component rendering on production for better error reporting. Enable it by using `REACT_ALOG=true rspeedy dev/build` or defining `__ALOG__` to `true` in `lynx.config.js`: ([#1164](#1164)) ```js export default defineConfig({ // ... source: { define: { __ALOG__: true, }, }, }); ``` - Make `preact/debug` work with `@lynx-js/react`. ([#1222](#1222)) - Introduce `@lynx-js/react/debug` which would include debugging warnings and error messages for common mistakes found. ([#1250](#1250)) Add the import to `@lynx-js/react/debug` at the first line of the entry: ```js import "@lynx-js/react/debug"; import { root } from "@lynx-js/react"; import { App } from "./App.jsx"; root.render(<App />); ``` - `<list-item/>` deferred now accepts an object with `unmountRecycled` property to control unmounting behavior when the item is recycled. ([#1302](#1302)) For example, you can use it like this: ```jsx <list-item defer={{ unmountRecycled: true }} item-key="1"> <WillBeUnmountIfRecycled /> </list-item> ``` Now the component will be unmounted when it is recycled, which can help with performance in certain scenarios. - Avoid some unexpected `__SetAttribute` in hydrate when `undefined` is passed as an attribute value to intrinsic elements, for example: ([#1318](#1318)) ```jsx <image async-mode={undefined} /> ``` ## @lynx-js/rspeedy@0.10.2 ### Patch Changes - Bump Rsbuild v1.4.6 with Rspack v1.4.8. ([#1282](#1282)) ## create-rspeedy@0.10.2 ### Patch Changes - Add `import '@lynx-js/react/debug'` for all templates. ([#1250](#1250)) ## @lynx-js/react-rsbuild-plugin@0.10.8 ### Patch Changes - Fix "TypeError: cannot read property 'call' of undefined" error during HMR updates. ([#1304](#1304)) - Supports extractStr for large JSON ([#1230](#1230)) - Change `extractStr` to `false` when `performance.chunkSplit.strategy` is not `all-in-one`. ([#1251](#1251)) - Updated dependencies \[[`cb7feb6`](cb7feb6), [`ec7228f`](ec7228f)]: - @lynx-js/template-webpack-plugin@0.8.2 - @lynx-js/react-alias-rsbuild-plugin@0.10.8 - @lynx-js/use-sync-external-store@1.5.0 - @lynx-js/react-refresh-webpack-plugin@0.3.4 - @lynx-js/react-webpack-plugin@0.6.18 - @lynx-js/css-extract-webpack-plugin@0.6.0 ## @lynx-js/react-alias-rsbuild-plugin@0.10.8 ### Patch Changes - Support `@lynx-js/react/debug`. ([#1250](#1250)) ## @lynx-js/testing-environment@0.1.3 ### Patch Changes - Support alog of component rendering on production for better error reporting. Enable it by using `REACT_ALOG=true rspeedy dev/build` or defining `__ALOG__` to `true` in `lynx.config.js`: ([#1164](#1164)) ```js export default defineConfig({ // ... source: { define: { __ALOG__: true, }, }, }); ``` - Supports `console.alog` and use different `console` object in main thread and background thread. ([#1164](#1164)) ## @lynx-js/web-constants@0.15.2 ### Patch Changes - feat: move SSR hydrate essential info to the ssr attribute ([#1292](#1292)) We found that in browser there is no simple tool to decode a base64 string Therefore we move the data to `ssr` attribute Also fix some ssr issues - feat: support \_\_MarkTemplateElement, \_\_MarkPartElement and \_\_GetTemplateParts for all-on-ui ([#1275](#1275)) - Updated dependencies \[]: - @lynx-js/web-worker-rpc@0.15.2 ## @lynx-js/web-core@0.15.2 ### Patch Changes - feat: support SSR for all-on-ui ([#1029](#1029)) - feat: move SSR hydrate essential info to the ssr attribute ([#1292](#1292)) We found that in browser there is no simple tool to decode a base64 string Therefore we move the data to `ssr` attribute Also fix some ssr issues - feat: support \_\_MarkTemplateElement, \_\_MarkPartElement and \_\_GetTemplateParts for all-on-ui ([#1275](#1275)) - feat: mark template elements for SSR and update part ID handling ([#1286](#1286)) - Updated dependencies \[[`cebda59`](cebda59), [`1443e46`](1443e46), [`5062128`](5062128), [`f656b7f`](f656b7f)]: - @lynx-js/web-mainthread-apis@0.15.2 - @lynx-js/web-constants@0.15.2 - @lynx-js/web-worker-runtime@0.15.2 - @lynx-js/web-worker-rpc@0.15.2 ## @lynx-js/web-core-server@0.15.2 ### Patch Changes - feat: support SSR for all-on-ui ([#1029](#1029)) - feat: move SSR hydrate essential info to the ssr attribute ([#1292](#1292)) We found that in browser there is no simple tool to decode a base64 string Therefore we move the data to `ssr` attribute Also fix some ssr issues - feat: dump the event info on ssr stage ([#1237](#1237)) - feat: mark template elements for SSR and update part ID handling ([#1286](#1286)) ## @lynx-js/web-elements@0.8.1 ### Patch Changes - fix: indicator dots' bg-color on safari 26 ([#1298](#1298)) <https://bugs.webkit.org/show_bug.cgi?id=296048> The animation name should be defined in the template - fix: list may only render only one column in ReactLynx. ([#1280](#1280)) This is because `span-count` may not be specified when `list-type` is specified, resulting in layout according to `span-count="1"`. Postponing the acquisition of `span-count` until layoutListItem can solve this problem. - Updated dependencies \[[`443f3d5`](443f3d5)]: - @lynx-js/web-elements-template@0.8.1 ## @lynx-js/web-elements-template@0.8.1 ### Patch Changes - fix: indicator dots' bg-color on safari 26 ([#1298](#1298)) <https://bugs.webkit.org/show_bug.cgi?id=296048> The animation name should be defined in the template ## @lynx-js/web-mainthread-apis@0.15.2 ### Patch Changes - feat: support SSR for all-on-ui ([#1029](#1029)) - feat: move SSR hydrate essential info to the ssr attribute ([#1292](#1292)) We found that in browser there is no simple tool to decode a base64 string Therefore we move the data to `ssr` attribute Also fix some ssr issues - feat: support \_\_MarkTemplateElement, \_\_MarkPartElement and \_\_GetTemplateParts for all-on-ui ([#1275](#1275)) - feat: mark template elements for SSR and update part ID handling ([#1286](#1286)) - Updated dependencies \[[`1443e46`](1443e46), [`5062128`](5062128)]: - @lynx-js/web-constants@0.15.2 ## @lynx-js/web-worker-runtime@0.15.2 ### Patch Changes - Updated dependencies \[[`cebda59`](cebda59), [`1443e46`](1443e46), [`5062128`](5062128), [`f656b7f`](f656b7f)]: - @lynx-js/web-mainthread-apis@0.15.2 - @lynx-js/web-constants@0.15.2 - @lynx-js/web-worker-rpc@0.15.2 ## @lynx-js/template-webpack-plugin@0.8.2 ### Patch Changes - Fix the `Syntax Error: expecting ';'` error of chunk splitting ([#1279](#1279)) ## upgrade-rspeedy@0.10.2 ## @lynx-js/web-worker-rpc@0.15.2 Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
|
What would you say to injecting |
We've already done that. We have an alias from lynx-stack/packages/rspeedy/plugin-react-alias/src/index.ts Lines 149 to 151 in 54eb5bf This bundle size regression (88.37KiB -> 88.43KiB (+0.07%)) in this PR would be optimized after web-infra-dev/rspack#10954 is landed. In short, the |
|
Sorry, by the boilerplate code I actually meant the source code here #1250 (comment). The automatic injection in the dev mode would mean no import of the |
This is what But for now, we would like to make it opt-in so that it could be disabled when having problems. |
Summary
Integrate with
preact/debug.A new exports
@lynx-js/react/debughas been added.close: m-6732088176
Checklist