Skip to content

Commit 9dbb875

Browse files
committed
docs(cn): update guide/profiling-test-performance.md
1 parent fa316c2 commit 9dbb875

2 files changed

Lines changed: 27 additions & 25 deletions

File tree

guide/migration.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ test('example', { concurrent: false }, async () => { /* ... */ }) // [!code ++]
3636

3737
### 命令中的定位器被序列化为对象 {#locators-in-commands-are-serialized-as-objects}
3838

39-
转发到 [浏览器命令](/api/browser/commands) 的定位器现在被序列化为 `SerializedLocator` 对象,而不是裸的选择器字符串。该对象公开两个字段
39+
转发到 [浏览器命令](/api/browser/commands) 的定位器现在被序列化为 `SerializedLocator` 对象,而不是裸的选择器字符串。该对象导出两个字段
4040

4141
- `selector`:提供程序特定的选择器字符串(与 commands 先前接收的值相同)。
4242
- `locator`:定位器的人类可读的(例如 `getByRole('button')`),用于错误消息和跟踪。

guide/profiling-test-performance.md

Lines changed: 26 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
- [`--prof`](https://nodejs.org/api/cli.html#--prof)
3131
3232
:::warning
33-
由于 `node:worker_threads` 的限制, `--prof` 不能与 `pool: 'threads'` 一起使用。
33+
由于 `node:worker_threads` 的限制,`--prof` 不能与 `pool: 'threads'` 一起使用。
3434
:::
3535
3636
要将这些选项传递给 Vitest 的测试运行器,请在 Vitest 配置中定义 `execArgv`
@@ -53,7 +53,7 @@ export default defineConfig({
5353
5454
测试运行后,应该会生成 `test-runner-profile/*.cpuprofile``test-runner-profile/*.heapprofile` 文件。想要知道如何分析这些文件,可以仔细查看 [性能分析记录](#inspecting-profiling-records)。
5555
56-
也可以看看 [性能分析 | 示例](https://github.com/vitest-dev/vitest/tree/main/examples/profiling)
56+
也可以看看 [性能分析 | 示例](https://github.com/vitest-dev/vitest/tree/main/examples/profiling)。
5757
5858
## 主线程 {#main-thread}
5959
@@ -74,18 +74,18 @@ $ node --cpu-prof --cpu-prof-dir=main-profile ./node_modules/vitest/vitest.mjs -
7474
# NodeJS arguments Vitest arguments
7575
```
7676
77-
测试运行后会生成一个 `main-profile/*.cpuprofile` 文件。有关如何分析这些文件的说明,可以查看[检查分析记录](#inspecting-profiling-records)。
77+
测试运行后会生成一个 `main-profile/*.cpuprofile` 文件。有关如何分析这些文件的说明,可以查看 [检查分析记录](#inspecting-profiling-records)。
7878
7979
## 文件转换 {#file-transform}
8080
81-
This profiling strategy is a good way to identify unnecessary transforms caused by [barrel files](https://vitejs.dev/guide/performance.html#avoid-barrel-files).
82-
If these logs contain files that should not be loaded when your test is run, you might have barrel files that are importing files unnecessarily.
81+
种分析策略有助于识别由 [桶文件](https://cn.vitejs.dev/guide/performance.html#avoid-barrel-files) 引起的不必要转换。如果这些日志包含在运行测试时不应加载的文件,你可能有一些桶文件在导入不必要的文件。
8382
84-
也可以使用 [Vitest UI](/guide/ui) 来调试由打包文件引起的缓慢问题。
85-
下面的例子展示了不使用打包文件导入文件可以减少约85%的转换文件数量。
83+
也可以使用 [UI 模式](/guide/ui) 来调试由打包文件引起的缓慢问题。
84+
下面的例子展示了不使用打包文件导入文件可以减少约 85% 的转换文件数量。
8685
8786
::: code-group
88-
``` [File tree]
87+
88+
```[File tree]
8989
├── src
9090
│ └── utils
9191
│ ├── currency.ts
@@ -99,6 +99,7 @@ If these logs contain files that should not be loaded when your test is run, you
9999
│ └── formatters.test.ts
100100
└── vitest.config.ts
101101
```
102+
102103
```ts [example.test.ts]
103104
import { expect, test } from 'vitest'
104105
import { formatter } from '../src/utils' // [!code --]
@@ -108,18 +109,19 @@ test('formatter works', () => {
108109
expect(formatter).not.toThrow()
109110
})
110111
```
112+
111113
:::
112-
<!-- TODO: translation -->
113-
<img src="/module-graph-barrel-file.png" alt="Vitest UI demonstrating barrel file issues" />
114114
115-
To see how files are transformed, you can open the "Module Info" view in the UI:
115+
<img src="/module-graph-barrel-file.png" alt="Vitest UI 模式展示桶文件问题" />
116+
117+
要查看文件是如何被转换的,你可以在 UI 模式 中打开 "模块信息" 视图:
116118
117119
<img alt="The module info view for an inlined module" img-light src="/ui/light-module-info.png">
118120
<img alt="The module info view for an inlined module" img-dark src="/ui/dark-module-info.png">
119121
120-
## File Import
122+
## 文件导入 {#file-import}
121123
122-
Some modules just take a long time to load. To identify which modules are the slowest, enable [`experimental.importDurations`](/config/experimental#experimental-importdurations) in your configuration:
124+
有些模块加载时间较长。要识别哪些模块最慢,请在配置中启用 [`experimental.importDurations`](/config/experimental#experimental-importdurations)
123125
124126
```ts [vitest.config.ts]
125127
import { defineConfig } from 'vitest/config'
@@ -135,7 +137,7 @@ export default defineConfig({
135137
})
136138
```
137139
138-
This will print a breakdown of the slowest imports after your tests finish:
140+
这将在测试完成后打印最慢导入的详情:
139141
140142
```bash
141143
Import Duration Breakdown (Top 10)
@@ -146,28 +148,28 @@ date-fns/index.js 500ms 500ms [████████████
146148
src/utils/helpers.ts 10ms 120ms [████████░░░░░░░░░░░░]
147149
```
148150
149-
You can also use `--experimental.importDurations.print` from the CLI without changing your configuration:
151+
你也可以在不更改配置的情况下,在 CLI 传递 `--experimental.importDurations.print` 参数:
150152
151153
```bash
152154
vitest --experimental.importDurations.print
153155
```
154156
155-
Once you've identified the slow modules, there are several strategies to speed up imports:
157+
一旦识别出慢速模块,有几种策略可以加速导入:
156158
157-
### Use Specific Entry Points
159+
### 使用特定入口 {#use-specific-entry-points}
158160
159-
Many libraries ship multiple entry points. Importing the main entry point (which is often a [barrel file](https://vitejs.dev/guide/performance.html#avoid-barrel-files)) can pull in far more code than you need.
161+
许多库提供了多个入口点。导入主入口点(通常是 [桶文件](https://vitejs.dev/guide/performance.html#avoid-barrel-files))可能会引入比你所需多得多的代码。
160162
161-
For example, `date-fns` re-exports hundreds of functions from its main entry point. Instead of importing from the top-level module, import directly from the specific function:
163+
例如,`date-fns` 从其主入口点重新导出了数百个函数。与其从顶层模块导入,不如直接从特定入口导入:
162164
163165
```ts
164166
import { format } from 'date-fns' // [!code --]
165167
import { format } from 'date-fns/format' // [!code ++]
166168
```
167169
168-
### Use `resolve.alias` to Redirect Imports
170+
### 使用 `resolve.alias` 重定向导入 {#use-resolve-alias-to-redirect-imports}
169171
170-
If a dependency doesn't provide granular entry points, or if third-party code imports the heavy entry point, you can use [`resolve.alias`](https://vite.dev/config/shared-options#resolve-alias) to redirect imports to a lighter alternative:
172+
如果一个依赖没有提供细粒度的入口,或者第三方代码导入了重量级入口点,你可以使用 [`resolve.alias`](https://cn.vite.dev/config/shared-options#resolve-alias) 将导入重定向到更轻量的替代方案:
171173
172174
```ts [vitest.config.ts]
173175
import { defineConfig } from 'vitest/config'
@@ -184,9 +186,9 @@ export default defineConfig({
184186
})
185187
```
186188
187-
### Use the Dependency Optimizer
189+
### 使用依赖优化器 {#use-the-dependency-optimizer}
188190
189-
Vitest can bundle external libraries into a single file using [`deps.optimizer`](/config/deps#deps-optimizer), which reduces the overhead of importing packages with many internal modules:
191+
Vitest 可以使用 [`deps.optimizer`](/config/deps#deps-optimizer) 将外部库打包到单个文件中,这减少了导入具有许多内部模块的包的开销:
190192
191193
```ts [vitest.config.ts]
192194
import { defineConfig } from 'vitest/config'
@@ -205,7 +207,7 @@ export default defineConfig({
205207
})
206208
```
207209
208-
This is especially effective for UI libraries and packages with deep import trees. Use `optimizer.ssr` for `node`/`edge` environments and `optimizer.client` for `jsdom`/`happy-dom` environments.
210+
这对于 UI 库和具有深层导入树的包极其有效。对于 `node`/`edge` 环境使用 `optimizer.ssr`,对于 `jsdom`/`happy-dom` 环境使用 `optimizer.client`
209211
210212
## 代码覆盖率 {#code-coverage}
211213

0 commit comments

Comments
 (0)