fix: migrate mdoc perf benchmark to new config

This commit is contained in:
bholmesdev 2023-03-06 13:02:43 -05:00
parent 9488ec7c9a
commit d1d4cc5211
8 changed files with 65 additions and 39 deletions

View file

@ -60,6 +60,7 @@ async function benchmark({ fixtures, templates }) {
console.log(
`\n${bold('Simple')} ${dim(`${NUM_POSTS} posts (${formatsToString(fixtures)})`)}`
);
process.env.ASTRO_PERFORMANCE_TEST_NAME = 'simple';
await benchmark({
fixtures,
templates: {
@ -77,6 +78,7 @@ async function benchmark({ fixtures, templates }) {
`${NUM_POSTS} posts (${formatsToString(fixtures)})`
)}`
);
process.env.ASTRO_PERFORMANCE_TEST_NAME = 'with-astro-components';
await benchmark({
fixtures,
templates: {
@ -93,6 +95,7 @@ async function benchmark({ fixtures, templates }) {
`${NUM_POSTS} posts (${formatsToString(fixtures)})`
)}`
);
process.env.ASTRO_PERFORMANCE_TEST_NAME = 'with-react-components';
await benchmark({
fixtures,
templates: {

View file

@ -4,5 +4,36 @@ import react from "@astrojs/react";
// https://astro.build/config
export default defineConfig({
integrations: [markdoc(), react()],
integrations: [markdoc({
nodes: process.env.ASTRO_PERFORMANCE_TEST_NAME === 'with-astro-components' ? {
heading: {
render: 'Heading',
attributes: {
level: { type: Number },
},
}
} : {},
tags: process.env.ASTRO_PERFORMANCE_TEST_NAME === 'with-astro-components' ? {
aside: {
render: 'Aside',
attributes: {
type: { type: String },
title: { type: String },
},
}
} : process.env.ASTRO_PERFORMANCE_TEST_NAME === 'with-react-components' ? {
'like-button': {
render: 'LikeButton',
attributes: {
liked: { type: Boolean },
},
},
'hydrated-like-button': {
render: 'HydratedLikeButton',
attributes: {
liked: { type: Boolean },
},
},
} : {},
}), react()],
});

View file

@ -1,5 +1,5 @@
---
import { Title, Aside, LikeButton, HydratedLikeButton } from '@performance/utils';
import { Heading, Aside, LikeButton, HydratedLikeButton } from '@performance/utils';
import type { CollectionEntry } from 'astro:content';
type Props = {
@ -11,33 +11,8 @@ const { Content } = await entry.render();
---
{entry.data.type === 'with-astro-components'
? <Content config={{
tags: {
aside: {
render: 'Aside',
attributes: {
type: { type: String },
title: { type: String },
},
}
}
}} components={{ h1: Title, Aside }} />
? <Content components={{ Heading, Aside }} />
: entry.data.type === 'with-react-components'
? <Content config={{
tags: {
'like-button': {
render: 'LikeButton',
attributes: {
liked: { type: Boolean },
},
},
'hydrated-like-button': {
render: 'HydratedLikeButton',
attributes: {
liked: { type: Boolean },
},
},
}
}} components={{ LikeButton, HydratedLikeButton }} />
? <Content components={{ LikeButton, HydratedLikeButton }} />
: <Content />
}

View file

@ -1,5 +1,5 @@
---
import { Title } from '@performance/utils';
import Title from './Title.astro';
import type { CollectionEntry } from 'astro:content';
type Props = {

View file

@ -0,0 +1,5 @@
---
import { Heading } from '@performance/utils';
---
<Heading level={1}><slot /></Heading>

View file

@ -0,0 +1,20 @@
---
type Props = {
level: number;
}
const { level } = Astro.props;
---
{level === 1 && <h1><slot /></h1>}
{level === 2 && <h2><slot /></h2>}
{level === 3 && <h3><slot /></h3>}
{level === 4 && <h4><slot /></h4>}
{level === 5 && <h5><slot /></h5>}
{level === 6 && <h6><slot /></h6>}
<style>
h1, h2, h3, h4, h5, h6 {
color: red;
text-transform: uppercase;
}
</style>

View file

@ -1,8 +0,0 @@
<h1><slot /></h1>
<style>
h1 {
color: red;
text-transform: uppercase;
}
</style>

View file

@ -1,6 +1,6 @@
// @ts-nocheck
export { default as RenderContent } from './RenderContent.astro';
export { default as Aside } from './Aside.astro';
export { default as Title } from './Title.astro';
export { default as Heading } from './Heading.astro';
export { default as LikeButton } from './LikeButton';
export { default as HydratedLikeButton } from './HydratedLikeButton.astro';