chore: Port FreeSewing.dev to docusaurus
The replaces the NextJS site powering FreeSewing.dev with a Docusaurus setup. It's part of my efforts to simplify FreeSewing's setup so we can focus on our core value proposition.
This commit is contained in:
parent
497633d1d3
commit
ab3204f9f1
692 changed files with 11037 additions and 20674 deletions
118
sites/dev/docs/reference/plugins/timing/readme.mdx
Normal file
118
sites/dev/docs/reference/plugins/timing/readme.mdx
Normal file
|
@ -0,0 +1,118 @@
|
|||
---
|
||||
title: plugin-timing
|
||||
---
|
||||
|
||||
Published as [@freesewing/plugin-timing][1], this plugin measures
|
||||
detailed timing information while drafting a design and adds it to the
|
||||
pattern store.
|
||||
|
||||
It is intended to be used by developers trying to determine which parts
|
||||
of their code are slow, or in general to provide insights into the speed
|
||||
at which a design can be drafted.
|
||||
|
||||
## Installation
|
||||
|
||||
```sh
|
||||
npm install @freesewing/plugin-timing
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
Either [add it as a part plugins](/reference/api/part/config/plugins) in your
|
||||
design, or [add it to a pattern instance with
|
||||
Pattern.use()](/reference/api/pattern/use).
|
||||
|
||||
To import the plugin for use:
|
||||
```js
|
||||
import { timingPlugin } from '@freesewing/plugin-timing'
|
||||
// or
|
||||
import { pluginTiming } from '@freesewing/plugin-timing'
|
||||
```
|
||||
|
||||
## Information in `store`
|
||||
|
||||
The plugin adds the following key/value pairs to the `store` before
|
||||
and after the pattern and parts drafting process.
|
||||
|
||||
| Key | Description |
|
||||
|----------|-------------|
|
||||
| `timing.draft.start` | Timestamp for the start of the pattern drafting process |
|
||||
| `timing.draft.took` | Time it took to draft the pattern |
|
||||
| `timing.parts.[part name].start` | Timestamp for the start of the part drafting process |
|
||||
| `timing.parts.[part name].took` | Time it took to draft the part |
|
||||
|
||||
:::note
|
||||
|
||||
Units and types depend on whether the pattern is generated in a browser
|
||||
or via Node.js.
|
||||
|
||||
- If the pattern is generated in a browser,
|
||||
both start timestamps and draft times are in milliseconds,
|
||||
and the values are Numbers.
|
||||
|
||||
- If the pattern is generated via Node.js,
|
||||
start timestamps are in nanoseconds, draft times are in microseconds,
|
||||
and the values are
|
||||
[BigInts](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt).
|
||||
|
||||
:::
|
||||
|
||||
## Examples
|
||||
|
||||
### Via Node.js
|
||||
|
||||
```js
|
||||
import { Aaron } from '@freesewing/aaron'
|
||||
import { pluginTiming } from '@freesewing/plugin-timing'
|
||||
|
||||
// Load some public test measurements from the FreeSewing backend
|
||||
const measurements = (
|
||||
await (
|
||||
await fetch("https://backend3.freesewing.org/curated-sets/1.json")
|
||||
).json()
|
||||
).measurements
|
||||
|
||||
const pattern = new Aaron({ measurements }).use(pluginTiming)
|
||||
|
||||
const svg = pattern.draft().render()
|
||||
|
||||
const patternTook = pattern.setStores[0].get(['timing', 'draft', 'took'])
|
||||
console.log('The Aaron pattern took ' + patternTook + ' µs to draft.')
|
||||
|
||||
const frontTook = pattern.setStores[0].get(['timing', 'parts', 'aaron.front', 'took'])
|
||||
console.log('The aaron.front part took ' + frontTook + ' µs to draft.')
|
||||
|
||||
console.log(JSON.stringify(pattern.setStores[0].timing,
|
||||
(key, value) => typeof value === 'bigint' ? value.toString() : value))
|
||||
```
|
||||
|
||||
### In a browser
|
||||
|
||||
For example, in `designs/aaron/src/back.mjs`:
|
||||
|
||||
```js
|
||||
import { pluginTiming } from '@freesewing/plugin-timing'
|
||||
import { front } from '@freesewing/aaron'
|
||||
|
||||
export const back = {
|
||||
from: front,
|
||||
plugins: [ pluginTiming ],
|
||||
draft: ({
|
||||
store,
|
||||
log,
|
||||
part,
|
||||
...
|
||||
}) => {
|
||||
...
|
||||
|
||||
const frontTook = store.get(['timing', 'parts', 'aaron.front', 'took'])
|
||||
log.info('The aaron.front part took ' + frontTook + ' ms to draft.')
|
||||
|
||||
log.info(JSON.stringify(store.timing))
|
||||
|
||||
return part
|
||||
},
|
||||
}
|
||||
```
|
||||
|
||||
[1]: https://www.npmjs.com/package/@freesewing/plugin-timing
|
Loading…
Add table
Add a link
Reference in a new issue