Skip to content

Commit a0878fd

Browse files
author
Zhicheng WANG
committed
e6f6a05281 fix: 不再进行预渲染
1 parent dd6cb0d commit a0878fd

File tree

1,056 files changed

+10906
-6282
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

1,056 files changed

+10906
-6282
lines changed

‎3rdpartylicenses.txt

Lines changed: 232 additions & 97 deletions
Large diffs are not rendered by default.

‎404.html

Lines changed: 25 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1-
<!DOCTYPE html><html lang="zh-Hans"><head>
1+
<!doctype html>
2+
<html lang="zh-Hans">
3+
4+
<head>
25
<meta charset="utf-8">
36
<title>Angular</title>
47
<meta name="Description" content="Angular is a platform for building mobile and desktop web applications.
@@ -21,12 +24,17 @@
2124
<link rel="apple-touch-icon" sizes="144x144" href="assets/images/favicons/favicon-144x144.png">
2225
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/images/favicons/favicon-144x144.png">
2326

24-
<!-- NOTE: These need to be kept in sync with `ngsw-config.json`. -->
25-
<link rel="stylesheet" href="assets/css/roboto.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="assets/css/roboto.css"></noscript>
26-
<link rel="stylesheet" href="assets/css/roboto-mono.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="assets/css/roboto-mono.css"></noscript>
27-
<link rel="stylesheet" href="assets/css/material-icons.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="assets/css/material-icons.css"></noscript>
27+
<!-- NOTE: These need to be kept in sync with `ngsw-config.template.json`. -->
28+
<link rel="stylesheet" href="assets/css/roboto.css">
29+
<link rel="stylesheet" href="assets/css/roboto-mono.css">
30+
<link rel="stylesheet" href="assets/css/material-icons.css">
2831
<!-- -->
2932

33+
<style id="aio-initial-theme">
34+
@import url("light-theme.css") (prefers-color-scheme: light);
35+
@import url("dark-theme.css") (prefers-color-scheme: dark);
36+
</style>
37+
3038
<link rel="manifest" href="pwa-manifest.json">
3139
<meta name="theme-color" content="#1976d2">
3240
<meta name="apple-mobile-web-app-capable" content="yes">
@@ -37,6 +45,12 @@
3745
// Note this is a customised version of the GA tracking snippet
3846
// See the comments below for more info
3947
(function (i, s, o, g, r, a, m) {
48+
if (i.trustedTypes) {
49+
// Specify path as a TrustedScriptURL when Trusted Types are available
50+
g = i.trustedTypes.createPolicy('aio#analytics', {
51+
createScriptURL: function (s) { return s; }
52+
}).createScriptURL(g);
53+
}
4054
i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
4155
(i[r].q = i[r].q || []).push(arguments)
4256
}, i[r].l = 1 * new Date(); a = s.createElement(o),
@@ -55,7 +69,7 @@
5569
function formatError(msg, url, line, col, e) {
5670
var stack;
5771
msg = msg.replace(/^Error: /, '');
58-
if (e) {
72+
if (e && e.stack) {
5973
stack = e.stack
6074
// strip the leading "Error: " from the stack trace
6175
.replace(/^Error: /, '')
@@ -79,7 +93,7 @@
7993
};
8094
</script>
8195

82-
<style>html{font-size:62.5%;}body{font-family:Roboto,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;margin:0;color:#444;font-size:16px;font-size:1.6rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}body,html{height:100%;}body{background-color:#fff;}@media print{*{box-shadow:none!important;}body{background:none!important;}}</style><link rel="stylesheet" href="styles.26c7acdc1e2d44a6f9e6.css" media="print" onload="this.media='all'"><noscript><link rel="stylesheet" href="styles.26c7acdc1e2d44a6f9e6.css"></noscript></head>
96+
<link rel="stylesheet" href="styles.5b4f92a7c473c620.css"></head>
8397

8498
<body>
8599

@@ -88,31 +102,16 @@
88102
<noscript>
89103
<div class="background-sky hero"></div>
90104
<section id="intro" style="text-shadow: 1px 1px #1976d2;">
91-
<div class="hero-logo">
92-
<img src="assets/images/logos/angular/angular.svg" width="250" height="250" alt="Angular">
93-
</div>
105+
<div class="hero-logo"></div>
94106
<div class="homepage-container">
95107
<div class="hero-headline">现代 Web 开发平台</div>
96108
</div>
97109
</section>
98-
<h2 style="color: red; margin-top: 40px; position: relative; text-align: center; text-shadow: 1px 1px #fafafa;">
110+
<h2 style="color: red; margin-top: 40px; position: relative; text-align: center; text-shadow: 1px 1px #fafafa; border-top: none;">
99111
<b><i>该网站需要浏览器支持 JavaScript </i></b>
100112
</h2>
101113
</noscript>
102114

103-
<!--
104-
Custom Elements polyfills required for browsers that natively support Custom Elements but not
105-
ES2015 modules. (See `custom-elements-es5-polyfills.js` for more info.)
106-
107-
NOTE:
108-
The polyfills here will be loaded before the ones in `polyfills.ts` (including
109-
`@webcomponents/custom-elements`). This is fine, because the polyfills here are only needed on
110-
browsers that natively support Custom Elements, on which `@webcomponents/custom-elements` will
111-
be a no-op (so the order of loading does not matter).
112-
-->
113-
<script src="generated/js/custom-elements-es5-polyfills.js" nomodule></script>
114-
115-
<script src="runtime-es2015.21b5bccd7c09e26ec8c2.js" type="module"></script><script src="runtime-es5.21b5bccd7c09e26ec8c2.js" nomodule defer></script><script src="polyfills-es5.bdf52e612630cfccaf6d.js" nomodule defer></script><script src="polyfills-es2015.e88e400822cab8b930d3.js" type="module"></script><script src="main-es2015.2bf9ef987c7f9c062694.js" type="module"></script><script src="main-es5.2bf9ef987c7f9c062694.js" nomodule defer></script>
116-
115+
<script src="runtime.e137d147975253b9.js" type="module"></script><script src="polyfills.598fc0fbb601048a.js" type="module"></script><script src="main.917030baf5629541.js" type="module"></script></body>
117116

118-
</body></html>
117+
</html>

‎assets/js/prettify.js

Lines changed: 4 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎assets/videos/introducing-angular-dev-tools.cn.mp4

8.6 MB
Binary file not shown.

‎assets/videos/introducing-angular-dev-tools.cn.srt

Lines changed: 112 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,112 @@
1+
1
2+
00:00:00,400 --> 00:00:01,500
3+
大家好！
4+
5+
2
6+
00:00:01,500 --> 00:00:02,500
7+
我是 Minko Gechev.
8+
9+
3
10+
00:00:02,800 --> 00:00:05,700
11+
我现在在 Google 的 Angular 开发组工作。
12+
13+
4
14+
00:00:06,100 --> 00:00:08,500
15+
在这个视频中，我要向你展示如何使用 Angular 的
16+
17+
5
18+
00:00:08,800 --> 00:00:13,500
19+
开发者工具来预览应用的结构，并剖析其性能
20+
21+
7
22+
00:00:15,100 --> 00:00:18,200
23+
Angular 开发者工具是一个 Chrome DevTools 扩展，你可以
24+
25+
8
26+
00:00:18,300 --> 00:00:20,100
27+
从 Chrome 的扩展程序商店下载它。
28+
29+
9
30+
00:00:21,000 --> 00:00:23,000
31+
你可以在稍后的描述中找到这个链接
32+
33+
10
34+
00:00:24,200 --> 00:00:28,300
35+
当安装好 Angular DevTools 之后，你可以到扩展程序中找到它，并固定它
36+
37+
12
38+
00:00:29,300 --> 00:00:32,400
39+
下一步是打开一个运行在开发模式下的应用
40+
41+
13
42+
00:00:32,600 --> 00:00:39,000
43+
注意其图标变成了红色，这表示我们可以调试此应用
44+
45+
15
46+
00:00:40,500 --> 00:00:44,000
47+
现在，打开 Chrome DevTools，并找到 Angular 页
48+
49+
16
50+
00:00:44,000 --> 00:00:45,300
51+
看这里
52+
53+
17
54+
00:00:45,400 --> 00:00:47,400
55+
我们可以预览应用的组件树
56+
57+
18
58+
00:00:49,100 --> 00:00:53,200
59+
一旦我们选择了某个组件，就可以在右侧的面板中找到它的元数据、属性
60+
61+
19
62+
00:00:54,000 --> 00:00:59,800
63+
输入属性、输出属性。我们还可以通过 UI 直接修改它们。
64+
65+
21
66+
00:01:01,200 --> 00:01:05,500
67+
现在，我们导航到 Profiler 页，并开始记录变更检测事件
68+
69+
23
70+
00:01:06,500 --> 00:01:09,100
71+
我们可以实时预览变更检测周期
72+
73+
24
74+
00:01:09,300 --> 00:01:15,100
75+
时间线中的每条柱子都对应着一个独立的变更检测周期
76+
77+
26
78+
00:01:16,500 --> 00:01:19,300
79+
我们可以找出在变更检测上花费了多少时间，以及
80+
81+
39
82+
00:01:19,600 --> 00:01:22,200
83+
当前的检测周期是否导致了任何丢帧现象
84+
85+
40
86+
00:01:23,300 --> 00:01:28,000
87+
我们还能预览预估的帧率，以及到底是什么触发了变更检测
88+
89+
42
90+
00:01:29,500 --> 00:01:32,900
91+
在底部，我们可以预览我们花费时间最多的组件
92+
93+
44
94+
00:01:34,200 --> 00:01:38,700
95+
当我们选择一个柱子时，可以看到关于部分组件的更详细信息
96+
97+
46
98+
00:01:40,100 --> 00:01:50,000
99+
为了更好地理解应用执行情况，我们可以在默认的柱状图
100+
和另外两个视图：火焰图和树状地图之间切换
101+
102+
49
103+
00:01:51,400 --> 00:01:52,600
104+
这就是我今天要讲给你听的
105+
106+
50
107+
00:01:53,500 --> 00:01:57,900
108+
到 angular.cn 的 DevTools 文档中了解其高级特性。
109+
110+
51
111+
00:01:58,000 --> 00:02:01,300
112+
感谢收看，编程快乐！

0 commit comments

Comments
 (0)