Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
李少辉-开发者
gitlab-foss
提交
66ee5b01
G
gitlab-foss
项目概览
李少辉-开发者
/
gitlab-foss
通知
15
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
G
gitlab-foss
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
未验证
提交
66ee5b01
编写于
3月 12, 2018
作者:
M
Mike Greiling
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
emphasize headings for each page-specific-javascript tip
上级
ae47afb9
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
24 addition
and
19 deletion
+24
-19
doc/development/fe_guide/performance.md
doc/development/fe_guide/performance.md
+24
-19
未找到文件。
doc/development/fe_guide/performance.md
浏览文件 @
66ee5b01
...
...
@@ -80,19 +80,22 @@ In addition to these page-specific bundles, the code within `main.js` and
#### Important Tips and Considerations:
-
If you are unsure what controller and action corresponds to a given page, you
-
**Identifying Controller Paths:**
If you are unsure what controller and action corresponds to a given page, you
can find this out by checking
`document.body.dataset.page`
while on any page
within gitlab.com.
-
Page-specific javascript entry points should be as lite as possible. These
-
**Keep Entry Points Lite:**
Page-specific javascript entry points should be as lite as possible. These
files are exempt from tests, and should be used primarily for instantiation
and dependency injection of classes and methods that live in modules outside
of the entry point script. Just import, read the DOM, instantiate, and
nothing else.
-
**DO NOT ASSUME**
that the DOM has been fully loaded and available when an
-
**Entry Points May Be Asynchronous:**
_DO NOT ASSUME_ that the DOM has been fully loaded and available when an
entry point script is run. If you require that some code be run after the
DOM has loaded, you
must
attach an event handler to the
`DOMContentLoaded`
DOM has loaded, you
should
attach an event handler to the
`DOMContentLoaded`
event with:
```javascript
...
...
@@ -103,20 +106,22 @@ In addition to these page-specific bundles, the code within `main.js` and
});
```
- If a class or a module is specific to a particular route, try to locate it
close to the entry point it will be used. For instance, if `my_widget.js` is
only imported within `pages/widget/show/index.js`, you should place the
module at `pages/widget/show/my_widget.js` and import it with a relative path
(e.g. `import initMyWidget from './my_widget';`).
- If a class or module is used by multiple routes, place it within a shared
directory at the closest common parent directory for the entry points that
import it. For example, if `my_widget.js` is imported within both
`pages/widget/show/index.js` and `pages/widget/run/index.js`, then place the
module at `pages/widget/shared/my_widget.js` and import it with a relative
path if possible `../shared/my_widget`.
- For GitLab Enterprise Edition, page-specific entry points will override their
- **Supporting Module Placement:**
- If a class or a module is _specific to a particular route_, try to locate
it close to the entry point it will be used. For instance, if
`my_widget.js` is only imported within `pages/widget/show/index.js`, you
should place the module at `pages/widget/show/my_widget.js` and import it
with a relative path (e.g. `import initMyWidget from './my_widget';`).
- If a class or module is _used by multiple routes_, place it within a
shared directory at the closest common parent directory for the entry
points that import it. For example, if `my_widget.js` is imported within
both `pages/widget/show/index.js` and `pages/widget/run/index.js`, then
place the module at `pages/widget/shared/my_widget.js` and import it with
a relative path if possible (e.g. `../shared/my_widget`).
- **Enterprise Edition Caveats:**
For GitLab Enterprise Edition, page-specific entry points will override their
Community Edition counterparts with the same name, so if
`ee/app/assets/javascripts/pages/foo/bar/index.js` exists, it will take
precedence over `app/assets/javascripts/pages/foo/bar/index.js`. If you want
...
...
@@ -139,7 +144,7 @@ import(/* webpackChunkName: 'emoji' */ '~/emoji')
Please try to use `webpackChunkName` when generating these dynamic imports as
it will provide a deterministic filename for the chunk which can then be cached
the browser.
the browser
across GitLab versions
.
More information is available in [webpack's code splitting documentation](https://webpack.js.org/guides/code-splitting/#dynamic-imports).
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录