⚝
One Hat Cyber Team
⚝
Your IP:
216.73.216.72
Server IP:
41.128.143.86
Server:
Linux host.raqmix.cloud 6.8.0-1025-azure #30~22.04.1-Ubuntu SMP Wed Mar 12 15:28:20 UTC 2025 x86_64
Server Software:
Apache
PHP Version:
8.3.23
Buat File
|
Buat Folder
Eksekusi
Dir :
~
/
proc
/
self
/
root
/
usr
/
share
/
grafana
/
public
/
build
/
View File Name :
BenchmarksPage.3a183df3d44714f9a96a.js.map
{"version":3,"file":"BenchmarksPage.3a183df3d44714f9a96a.js","mappings":"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","sources":["webpack://grafana/./packages/grafana-ui/src/components/ThemeDemos/EmotionPerfTest.tsx","webpack://grafana/./public/app/features/sandbox/BenchmarksPage.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx jsx */\nimport { css, cx } from '@emotion/css';\nimport { jsx } from '@emotion/react';\nimport classnames from 'classnames';\nimport { Profiler, ProfilerOnRenderCallback, useState, FC } from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\n\nimport { useStyles2, useTheme2 } from '../../themes';\nimport { Button } from '../Button';\nimport { VerticalGroup } from '../Layout/Layout';\n\nexport function EmotionPerfTest() {\n console.log('process.env.NODE_ENV', process.env.NODE_ENV);\n\n return (\n <VerticalGroup>\n <div>Emotion performance tests</div>\n <TestScenario name=\"No styles\" Component={NoStyles} />\n <TestScenario name=\"inline emotion/css\" Component={InlineEmotionCSS} />\n <TestScenario name=\"useStyles no cx\" Component={UseStylesNoCX} />\n <TestScenario name=\"useStyles with conditional cx styles\" Component={UseStylesWithConditionalCX} />\n <TestScenario name=\"useStyles with css prop\" Component={UseStylesWithCSSProp} />\n <TestScenario name=\"useStyles with conditional css prop\" Component={UseStylesWithConditionalCSS} />\n <TestScenario name=\"useStyles with conditional classnames\" Component={UseStylesWithConditionalClassNames} />\n </VerticalGroup>\n );\n}\n\nexport const TestScenario: FC<{ name: string; Component: FC<TestComponentProps> }> = ({ name, Component }) => {\n const [render, setRender] = useState(0);\n\n return (\n <div>\n <Button onClick={() => setRender(render > 2 ? 0 : render + 1)}>{name}</Button>\n {render > 0 && <MeasureRender id={name}>{renderManyComponents(Component)}</MeasureRender>}\n </div>\n );\n};\n\nTestScenario.displayName = 'TestScenario';\n\nfunction renderManyComponents(Component: FC<TestComponentProps>) {\n const elements: React.ReactNode[] = [];\n\n for (let i = 0; i < 5000; i++) {\n elements.push(<Component index={i} key={i.toString()} />);\n }\n\n return <div style={{ display: 'flex', flexWrap: 'wrap' }}>{elements}</div>;\n}\n\ninterface TestComponentProps {\n index: number;\n}\n\nfunction UseStylesNoCX({ index }: TestComponentProps) {\n const styles = useStyles2(getStyles);\n return (\n <div className={styles.main}>\n <div className={styles.child}>{index}</div>\n </div>\n );\n}\n\nfunction UseStylesWithConditionalCX({ index }: TestComponentProps) {\n const styles = useStyles2(getStyles);\n const mainStyles = cx(styles.main, { [styles.large]: index > 10, [styles.disabed]: index % 10 === 0 });\n\n return (\n <div className={mainStyles}>\n <div className={styles.child}>{index}</div>\n </div>\n );\n}\n\nfunction UseStylesWithConditionalClassNames({ index }: TestComponentProps) {\n const styles = useStyles2(getStyles);\n const mainStyles = classnames(styles.main, { [styles.large]: index > 10, [styles.disabed]: index % 10 === 0 });\n\n return (\n <div className={mainStyles}>\n <div className={styles.child}>{index}</div>\n </div>\n );\n}\n\nfunction UseStylesWithCSSProp({ index }: TestComponentProps) {\n const styles = useStyles2(getStylesObjects);\n\n return (\n <div css={styles.main}>\n <div css={styles.child}>{index}</div>\n </div>\n );\n}\n\nfunction UseStylesWithConditionalCSS({ index }: TestComponentProps) {\n const styles = useStyles2(getStylesObjects);\n const mainStyles = [styles.main, index > 10 && styles.large, index % 10 === 0 && styles.disabed];\n return (\n <div css={mainStyles}>\n <div css={styles.child}>{index}</div>\n </div>\n );\n}\n\nfunction InlineEmotionCSS({ index }: TestComponentProps) {\n const theme = useTheme2();\n const styles = getStyles(theme);\n\n return (\n <div className={styles.main}>\n <div className={styles.child}>{index}</div>\n </div>\n );\n}\n\nfunction NoStyles({ index }: TestComponentProps) {\n return (\n <div className=\"no-styles-main\">\n <div className=\"no-styles-child\">{index}</div>\n </div>\n );\n}\n\nfunction MeasureRender({ children, id }: { children: React.ReactNode; id: string }) {\n const onRender: ProfilerOnRenderCallback = (id, phase, actualDuration, baseDuration, startTime, commitTime) => {\n console.log('Profile ' + id, actualDuration);\n };\n\n return (\n <Profiler id={id} onRender={onRender}>\n {children}\n </Profiler>\n );\n}\n\nconst getStyles = (theme: GrafanaTheme2) => {\n return {\n main: css(getStylesObjectMain(theme)),\n large: css({\n fontSize: '20px',\n color: 'red',\n }),\n disabed: css({\n fontSize: '10px',\n color: 'gray',\n }),\n child: css(getStylesObjectChild(theme)),\n };\n};\n\nconst getStylesObjects = (theme: GrafanaTheme2) => {\n return {\n main: getStylesObjectMain(theme),\n large: {\n fontSize: '20px',\n color: 'red',\n },\n disabed: {\n fontSize: '10px',\n color: 'gray',\n },\n child: getStylesObjectChild(theme),\n };\n};\n\nfunction getStylesObjectMain(theme: GrafanaTheme2) {\n return {\n background: 'blue',\n border: '1px solid red',\n color: 'white',\n padding: theme.spacing(1),\n shadow: theme.shadows.z1,\n ':hover': {\n background: theme.colors.background.primary,\n },\n };\n}\n\nfunction getStylesObjectChild(theme: GrafanaTheme2) {\n return {\n padding: '2px',\n fontSize: '10px',\n boxShadow: 'none',\n textAlign: 'center',\n textDecoration: 'none',\n } as const;\n}\n","import React from 'react';\n\nimport { VerticalGroup } from '@grafana/ui';\nimport { EmotionPerfTest } from '@grafana/ui/src/components/ThemeDemos/EmotionPerfTest';\n\nexport const BenchmarksPage = () => {\n return (\n <VerticalGroup>\n <EmotionPerfTest />\n </VerticalGroup>\n );\n};\n\nexport default BenchmarksPage;\n"],"names":["EmotionPerfTest","TestScenario","NoStyles","InlineEmotionCSS","UseStylesNoCX","UseStylesWithConditionalCX","UseStylesWithCSSProp","UseStylesWithConditionalCSS","UseStylesWithConditionalClassNames","name","Component","render","setRender","Button","MeasureRender","renderManyComponents","elements","i","index","styles","getStyles","mainStyles","getStylesObjects","theme","children","id","onRender","phase","actualDuration","baseDuration","startTime","commitTime","getStylesObjectMain","getStylesObjectChild","BenchmarksPage"],"sourceRoot":""}