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

Only traverse children and handle mdxJsxTextElement when optimizing #10885

Merged
merged 2 commits into from
Apr 26, 2024

Conversation

bluwy
Copy link
Member

@bluwy bluwy commented Apr 26, 2024

Changes

rehype-optimize-static.ts wasn't working as intended in some cases. For example, if you have:

<Card foo="bar">
  This is content
</Card>

Previously it compiles to:

<Card foo="bar">
  <_components.p set:html="This is content" />
</Card>

But what it should be is

<Card foo="bar" set:html="<p>This is content</p>" />

This PR fixes it by adding if (key != null && key !== 'children') return SKIP because we accidentally visited foo="bar" (part of node.attributes), which de-optimizes the flow. The key check helps avoid the attributes key.


I also made a second change to add mdxJsxTextElement as a proper MDX node. It is kinda synonymous to mdxJsxFlowElement, but I forgot to add both of them.

Testing

Sorry, I don't have tests for rehype-optimize-static 😅 This is all manually tested in the astro docs repo.

Docs

n/a. internal change. Added a changeset

Copy link

changeset-bot bot commented Apr 26, 2024

🦋 Changeset detected

Latest commit: 8db9e43

The changes in this PR will be included in the next version bump.

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

@github-actions github-actions bot added the pkg: integration Related to any renderer integration (scope) label Apr 26, 2024
@bluwy bluwy merged commit 2abfc66 into mdx-v3 Apr 26, 2024
4 checks passed
@bluwy bluwy deleted the mdx-optimize-better branch April 26, 2024 09:22
@bluwy bluwy mentioned this pull request May 2, 2024
ematipico pushed a commit that referenced this pull request May 8, 2024
* fix(mdx): convert remark-images-to-component plugin to a rehype plugin (#10697)

* Remove fs read for MDX transform (#10866)

* Tag MDX component for faster checks when rendering (#10864)

* Use unified plugin only for MDX transform (#10869)

* Only traverse children and handle mdxJsxTextElement when optimizing (#10885)

* Rename to `optimize.ignoreComponentNames` in MDX (#10884)

* Allow remark/rehype plugins added after mdx to work (#10877)

* Improve MDX optimize with sibling nodes (#10887)

* Improve types in rehype-optimize-static.ts

* Rename `ignoreComponentNames` to `ignoreElementNames`

I think this better reflects what it's actually doing

* Simplify plain MDX nodes in optimize option (#10934)

* Format code

* Minimize diff changes

* Update .changeset/slimy-cobras-end.md

Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>

---------

Co-authored-by: Armand Philippot <59021693+ArmandPhilippot@users.noreply.github.com>
Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
pkg: integration Related to any renderer integration (scope)
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants