Skip to content
This repository was archived by the owner on Mar 4, 2020. It is now read-only.

Commit 6e8ab70

Browse files
miroslavstastnymiroslavstastny
authored
docs: Add component perf charts to public docsite (#2240)
* docs: Add component perf charts to public docsite * - changelog * - fix changelog
1 parent 6f3dbb6 commit 6e8ab70

File tree

15 files changed

+62
-60
lines changed

15 files changed

+62
-60
lines changed

‎CHANGELOG.md

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,13 +21,16 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm
2121
- Add `@fluentui/styles` package for all styles' related utilities and TS types @layershifter, @mnajdova ([#2222](https://github.com/microsoft/fluent-ui-react/pull/2222))
2222

2323
### Fixes
24-
- Fix event lister leak in `FocusZone` @miroslavstastny ([#2227](https://github.com/microsoft/fluent-ui-react/pull/2227))
24+
- Fix event listener leak in `FocusZone` @miroslavstastny ([#2227](https://github.com/microsoft/fluent-ui-react/pull/2227))
2525
- Fix styleParam to always be required in the styles functions @layershifter, @mnajdova ([#2235](https://github.com/microsoft/fluent-ui-react/pull/2235))
2626

2727
### Features
2828
- Allow `useRef` hook used for storing debugging data to be defined in any order with other hooks in functional components @layershifter, @mnajdova ([#2236](https://github.com/microsoft/fluent-ui-react/pull/2236))
2929
- Add `useStyles()` hook to use theming capabilities in custom components @layershifter, @mnajdova ([#2217](https://github.com/microsoft/fluent-ui-react/pull/2217))
3030

31+
### Documentation
32+
- Add per-component performance charts @miroslavstastny ([#2240](https://github.com/microsoft/fluent-ui-react/pull/2240))
33+
3134
<!--------------------------------[ v0.43.0 ]------------------------------- -->
3235
## [v0.43.0](https://github.com/microsoft/fluent-ui-react/tree/v0.43.0) (2020-01-08)
3336
[Compare changes](https://github.com/microsoft/fluent-ui-react/compare/v0.42.0..v0.43.0)

‎docs/src/components/ComponentDoc/ComponentPerfExample/ComponentPerfChart.tsx

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -90,16 +90,18 @@ export const ComponentPerfChart = ({ perfTestName }) => {
9090
return (
9191
<div>
9292
<Flex vAlign="center" gap="gap.large">
93-
<RadioGroup
94-
defaultCheckedValue={FILTER_BY.CI_BUILD}
95-
checkedValueChanged={handleFilterChange}
96-
items={[
97-
{ key: 'ci-build', label: FILTER_BY.CI_BUILD, value: FILTER_BY.CI_BUILD },
98-
{ key: 'release', label: FILTER_BY.RELEASE, value: FILTER_BY.RELEASE },
99-
{ key: 'day', label: FILTER_BY.DAY, value: FILTER_BY.DAY },
100-
{ key: 'month', label: FILTER_BY.MONTH, value: FILTER_BY.MONTH },
101-
]}
102-
/>
93+
{process.env.NODE_ENV !== 'production' && (
94+
<RadioGroup
95+
defaultCheckedValue={FILTER_BY.CI_BUILD}
96+
checkedValueChanged={handleFilterChange}
97+
items={[
98+
{ key: 'ci-build', label: FILTER_BY.CI_BUILD, value: FILTER_BY.CI_BUILD },
99+
{ key: 'release', label: FILTER_BY.RELEASE, value: FILTER_BY.RELEASE },
100+
{ key: 'day', label: FILTER_BY.DAY, value: FILTER_BY.DAY },
101+
{ key: 'month', label: FILTER_BY.MONTH, value: FILTER_BY.MONTH },
102+
]}
103+
/>
104+
)}
103105
<Checkbox
104106
label="Show extremes"
105107
defaultChecked={withExtremes}

‎docs/src/components/ComponentDoc/PerfChart/PerfDataProvider.tsx

Lines changed: 12 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -17,21 +17,18 @@ const PerfDataProvider: React.FC = ({ children }) => {
1717
const [data, setData] = React.useState()
1818

1919
React.useEffect(() => {
20-
if (process.env.NODE_ENV === 'production') {
21-
setError(new Error('Stats data not available in production'))
22-
setLoading(false)
23-
} else {
24-
fetch(config.getStatsUri)
25-
.then(response => response.json())
26-
.then(responseJson => {
27-
setData(responseJson)
28-
setLoading(false)
29-
})
30-
.catch(e => {
31-
setError(e)
32-
setLoading(false)
33-
})
34-
}
20+
const query = process.env.NODE_ENV === 'production' ? '' : '?withPrivateBuilds=true'
21+
22+
fetch(`${config.getStatsUri}${query}`)
23+
.then(response => response.json())
24+
.then(responseJson => {
25+
setData(responseJson)
26+
setLoading(false)
27+
})
28+
.catch(e => {
29+
setError(e)
30+
setLoading(false)
31+
})
3532
}, [])
3633

3734
return (

‎docs/src/config.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
const config = {
2-
getStatsUri: 'https://stardust.azurewebsites.net/api/GetPerfStats',
2+
getStatsUri: 'https://fluent-ui-react-stats.azurewebsites.net/api/GetPerfStats',
33
}
44

55
export default config

‎docs/src/examples/components/Attachment/Performance/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import * as React from 'react'
22

33
import ComponentPerfExample from 'docs/src/components/ComponentDoc/ComponentPerfExample'
4-
import NonPublicSection from 'docs/src/components/ComponentDoc/NonPublicSection'
4+
import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
55

66
const Performance = () => (
7-
<NonPublicSection title="Performance">
7+
<ExampleSection title="Performance">
88
<ComponentPerfExample
99
title="Default"
1010
description="A default test."
1111
examplePath="components/Attachment/Performance/AttachmentMinimal.perf"
1212
/>
13-
</NonPublicSection>
13+
</ExampleSection>
1414
)
1515

1616
export default Performance

‎docs/src/examples/components/Button/Performance/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import * as React from 'react'
22

33
import ComponentPerfExample from 'docs/src/components/ComponentDoc/ComponentPerfExample'
4-
import NonPublicSection from 'docs/src/components/ComponentDoc/NonPublicSection'
4+
import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
55

66
const Performance = () => (
7-
<NonPublicSection title="Performance">
7+
<ExampleSection title="Performance">
88
<ComponentPerfExample
99
title="Default"
1010
description="A default test."
1111
examplePath="components/Button/Performance/ButtonMinimal.perf"
1212
/>
13-
</NonPublicSection>
13+
</ExampleSection>
1414
)
1515

1616
export default Performance

‎docs/src/examples/components/Chat/Performance/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import * as React from 'react'
22

33
import ComponentPerfExample from 'docs/src/components/ComponentDoc/ComponentPerfExample'
4-
import NonPublicSection from 'docs/src/components/ComponentDoc/NonPublicSection'
4+
import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
55

66
const Performance = () => (
7-
<NonPublicSection title="Performance">
7+
<ExampleSection title="Performance">
88
<ComponentPerfExample
99
title="Duplicate Messages"
1010
description="Chat with many duplicate messages."
@@ -15,7 +15,7 @@ const Performance = () => (
1515
description="Chat with actions menu in a popover."
1616
examplePath="components/Chat/Performance/ChatWithPopover.perf"
1717
/>
18-
</NonPublicSection>
18+
</ExampleSection>
1919
)
2020

2121
export default Performance

‎docs/src/examples/components/Divider/Performance/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import * as React from 'react'
22

33
import ComponentPerfExample from 'docs/src/components/ComponentDoc/ComponentPerfExample'
4-
import NonPublicSection from 'docs/src/components/ComponentDoc/NonPublicSection'
4+
import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
55

66
const Performance = () => (
7-
<NonPublicSection title="Performance">
7+
<ExampleSection title="Performance">
88
<ComponentPerfExample
99
title="Default"
1010
description="A default test."
1111
examplePath="components/Divider/Performance/DividerMinimal.perf"
1212
/>
13-
</NonPublicSection>
13+
</ExampleSection>
1414
)
1515

1616
export default Performance

‎docs/src/examples/components/Dropdown/Performance/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import * as React from 'react'
22

33
import ComponentPerfExample from 'docs/src/components/ComponentDoc/ComponentPerfExample'
4-
import NonPublicSection from 'docs/src/components/ComponentDoc/NonPublicSection'
4+
import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
55

66
const Performance = () => (
7-
<NonPublicSection title="Performance">
7+
<ExampleSection title="Performance">
88
<ComponentPerfExample
99
title="Default"
1010
description="A default test."
1111
examplePath="components/Dropdown/Performance/DropdownManyItems.perf"
1212
/>
13-
</NonPublicSection>
13+
</ExampleSection>
1414
)
1515

1616
export default Performance

‎docs/src/examples/components/Header/Performance/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import * as React from 'react'
22

33
import ComponentPerfExample from 'docs/src/components/ComponentDoc/ComponentPerfExample'
4-
import NonPublicSection from 'docs/src/components/ComponentDoc/NonPublicSection'
4+
import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
55

66
const Performance = () => (
7-
<NonPublicSection title="Performance">
7+
<ExampleSection title="Performance">
88
<ComponentPerfExample
99
title="Default"
1010
description="A default test."
@@ -15,7 +15,7 @@ const Performance = () => (
1515
description="Header with no props."
1616
examplePath="components/Header/Performance/HeaderMinimal.perf"
1717
/>
18-
</NonPublicSection>
18+
</ExampleSection>
1919
)
2020

2121
export default Performance

‎docs/src/examples/components/Icon/Performance/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import * as React from 'react'
22

33
import ComponentPerfExample from 'docs/src/components/ComponentDoc/ComponentPerfExample'
4-
import NonPublicSection from 'docs/src/components/ComponentDoc/NonPublicSection'
4+
import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
55

66
const Performance = () => (
7-
<NonPublicSection title="Performance">
7+
<ExampleSection title="Performance">
88
<ComponentPerfExample
99
title="Default"
1010
description="A default test."
1111
examplePath="components/Icon/Performance/IconMinimal.perf"
1212
/>
13-
</NonPublicSection>
13+
</ExampleSection>
1414
)
1515

1616
export default Performance

‎docs/src/examples/components/List/Performance/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import * as React from 'react'
22

33
import ComponentPerfExample from 'docs/src/components/ComponentDoc/ComponentPerfExample'
4-
import NonPublicSection from 'docs/src/components/ComponentDoc/NonPublicSection'
4+
import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
55

66
const Performance = () => (
7-
<NonPublicSection title="Performance">
7+
<ExampleSection title="Performance">
88
<ComponentPerfExample
99
title="Common"
1010
description="A typical list with common slots filled."
1111
examplePath="components/List/Performance/ListCommon.perf"
1212
/>
13-
</NonPublicSection>
13+
</ExampleSection>
1414
)
1515

1616
export default Performance

‎docs/src/examples/components/Loader/Performance/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import * as React from 'react'
22

33
import ComponentPerfExample from 'docs/src/components/ComponentDoc/ComponentPerfExample'
4-
import NonPublicSection from 'docs/src/components/ComponentDoc/NonPublicSection'
4+
import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
55

66
const Performance = () => (
7-
<NonPublicSection title="Performance">
7+
<ExampleSection title="Performance">
88
<ComponentPerfExample
99
title="Default"
1010
description="A default test."
1111
examplePath="components/Loader/Performance/LoaderMinimal.perf"
1212
/>
13-
</NonPublicSection>
13+
</ExampleSection>
1414
)
1515

1616
export default Performance

‎docs/src/examples/components/Provider/Performance/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import * as React from 'react'
22

33
import ComponentPerfExample from 'docs/src/components/ComponentDoc/ComponentPerfExample'
4-
import NonPublicSection from 'docs/src/components/ComponentDoc/NonPublicSection'
4+
import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
55

66
const Performance = () => (
7-
<NonPublicSection title="Performance">
7+
<ExampleSection title="Performance">
88
<ComponentPerfExample
99
title="Merge themes"
1010
description="mergeThemes perf"
1111
examplePath="components/Provider/Performance/ProviderMergeThemes.perf"
1212
/>
13-
</NonPublicSection>
13+
</ExampleSection>
1414
)
1515

1616
export default Performance

‎docs/src/examples/components/Toolbar/Performance/index.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
import * as React from 'react'
22

33
import ComponentPerfExample from 'docs/src/components/ComponentDoc/ComponentPerfExample'
4-
import NonPublicSection from 'docs/src/components/ComponentDoc/NonPublicSection'
4+
import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
55

66
const Performance = () => (
7-
<NonPublicSection title="Performance">
7+
<ExampleSection title="Performance">
88
<ComponentPerfExample
99
title="Custom styled"
1010
description="Custom styled toolbar"
1111
examplePath="components/Toolbar/Performance/CustomToolbar.perf"
1212
/>
13-
</NonPublicSection>
13+
</ExampleSection>
1414
)
1515

1616
export default Performance

0 commit comments

Comments
 (0)