Skip to content

Commit 25a4e6c

Browse files
committed
docs: translate page preload
1 parent d7bd592 commit 25a4e6c

File tree

1 file changed

+40
-40
lines changed

1 file changed

+40
-40
lines changed

src/content/reference/react-dom/preload.md

Lines changed: 40 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -5,19 +5,19 @@ canary: true
55

66
<Canary>
77

8-
The `preload` function is currently only available in React's Canary and experimental channels. Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
8+
Fungsi `preload` saat ini hanya tersedia di kanal Canary dan eksperimental React. Pelajari lebih lanjut tentang [kanal rilis React di sini](/community/versioning-policy#all-release-channels).
99

1010
</Canary>
1111

1212
<Note>
1313

14-
[React-based frameworks](/learn/start-a-new-react-project) frequently handle resource loading for you, so you might not have to call this API yourself. Consult your framework's documentation for details.
14+
[Framework berbasis React](/learn/start-a-new-react-project) sering kali menangani pemuatan sumber daya untuk Anda, jadi Anda mungkin tidak perlu memanggil API ini sendiri. Lihat dokumentasi framework Anda untuk detailnya.
1515

1616
</Note>
1717

1818
<Intro>
1919

20-
`preload` lets you eagerly fetch a resource such as a stylesheet, font, or external script that you expect to use.
20+
`preload` memungkinkan Anda mengambil sumber daya seperti *stylesheet*, *font*, atau skrip eksternal yang ingin Anda gunakan.
2121

2222
```js
2323
preload("https://example.com/font.woff2", {as: "font"});
@@ -29,11 +29,11 @@ preload("https://example.com/font.woff2", {as: "font"});
2929

3030
---
3131

32-
## Reference {/*reference*/}
32+
## Referensi {/*reference*/}
3333

3434
### `preload(href, options)` {/*preload*/}
3535

36-
To preload a resource, call the `preload` function from `react-dom`.
36+
Untuk memuat sumber daya, panggil fungsi `preload` dari `react-dom`.
3737

3838
```js
3939
import { preload } from 'react-dom';
@@ -45,47 +45,47 @@ function AppRoot() {
4545

4646
```
4747

48-
[See more examples below.](#usage)
48+
[Lihat contoh lainnya di bawah ini.](#usage)
4949

50-
The `preload` function provides the browser with a hint that it should start downloading the given resource, which can save time.
50+
Fungsi `preload` memberikan petunjuk kepada browser untuk mulai mengunduh sumber daya yang diberikan, yang dapat menghemat waktu.
5151

52-
#### Parameters {/*parameters*/}
52+
#### Parameter {/*parameters*/}
5353

54-
* `href`: a string. The URL of the resource you want to download.
55-
* `options`: an object. It contains the following properties:
56-
* `as`: a required string. The type of resource. Its [possible values](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#as) are `audio`, `document`, `embed`, `fetch`, `font`, `image`, `object`, `script`, `style`, `track`, `video`, `worker`.
57-
* `crossOrigin`: a string. The [CORS policy](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/crossorigin) to use. Its possible values are `anonymous` and `use-credentials`. It is required when `as` is set to `"fetch"`.
58-
* `referrerPolicy`: a string. The [Referrer header](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#referrerpolicy) to send when fetching. Its possible values are `no-referrer-when-downgrade` (the default), `no-referrer`, `origin`, `origin-when-cross-origin`, and `unsafe-url`.
59-
* `integrity`: a string. A cryptographic hash of the resource, to [verify its authenticity](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity).
60-
* `type`: a string. The MIME type of the resource.
61-
* `nonce`: a string. A cryptographic [nonce to allow the resource](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce) when using a strict Content Security Policy.
62-
* `fetchPriority`: a string. Suggests a relative priority for fetching the resource. The possible values are `auto` (the default), `high`, and `low`.
63-
* `imageSrcSet`: a string. For use only with `as: "image"`. Specifies the [source set of the image](https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images).
64-
* `imageSizes`: a string. For use only with `as: "image"`. Specifies the [sizes of the image](https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images).
54+
* `href`: sebuah string. URL sumber daya yang ingin Anda unduh.
55+
* `options`: sebuah objek. Ini berisi properti-properti berikut:
56+
* `as`: string yang diperlukan. Jenis sumber daya. Nilai [yang memungkinkan](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#as) adalah `audio`, `document`, `embed`, `fetch`, `font`, `image`, `object`, `script`, `style`, `track`, `video`, `worker`.
57+
* `crossOrigin`: sebuah string. [Kebijakan CORS](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/crossorigin) yang akan digunakan. Nilai yang mungkin adalah `anonymous` dan `use-credentials`. Ini diperlukan ketika `as` disetel ke `"fetch"`.
58+
* `referrerPolicy`: sebuah string. [Referrer header](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#referrerpolicy) yang akan dikirim saat *fetching*. Nilai yang memungkinkan adalah `no-referrer-when-downgrade` (default), `no-referrer`, `origin`, `origin-when-cross-origin`, dan `unsafe-url`.
59+
* `integrity`: sebuah string. Hash kriptografi sumber daya, untuk [memverifikasi keasliannya](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity).
60+
* `type`: sebuah string. Jenis MIME sumber daya.
61+
* `nonce`: sebuah string. Sebuah kriptografi [*nonce* untuk mengizinkan sumber daya](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce) ketika menggunakan *Content Security Policy* yang ketat.
62+
* `fetchPriority`: sebuah string. Menyarankan prioritas relatif untuk mengambil sumber daya. Nilai yang memungkinkan adalah `auto` (default), `high`, dan `low`.
63+
* `imageSrcSet`: sebuah string. Hanya untuk digunakan dengan `as: image"`. Menentukan [kumpulan sumber gambar](https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images).
64+
* `imageSizes`: sebuah string. Hanya untuk digunakan dengan `as: image"`. Menentukan [ukuran gambar](https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images).
6565

66-
#### Returns {/*returns*/}
66+
#### Kembalian {/*returns*/}
6767

68-
`preload` returns nothing.
68+
`preload` tidak mengembalikan apa pun.
6969

70-
#### Caveats {/*caveats*/}
70+
#### Peringatan {/*caveats*/}
7171

72-
* Multiple equivalent calls to `preload` have the same effect as a single call. Calls to `preload` are considered equivalent according to the following rules:
73-
* Two calls are equivalent if they have the same `href`, except:
74-
* If `as` is set to `image`, two calls are equivalent if they have the same `href`, `imageSrcSet`, and `imageSizes`.
75-
* In the browser, you can call `preload` in any situation: while rendering a component, in an Effect, in an event handler, and so on.
76-
* In server-side rendering or when rendering Server Components, `preload` only has an effect if you call it while rendering a component or in an async context originating from rendering a component. Any other calls will be ignored.
72+
* Beberapa panggilan setara ke `preload` memiliki efek yang sama dengan panggilan tunggal. Panggilan ke `preload` dianggap setara menurut aturan berikut:
73+
* Dua pemanggilan setara jika memiliki `href` yang sama, kecuali:
74+
* Jika `as` diset ke `image`, dua panggilan setara jika memiliki `href`, `imageSrcSet`, dan `imageSizes` yang sama.
75+
* Di browser, Anda dapat memanggil `preload` dalam situasi apa pun: saat me-*render* komponen, di *Effect*, di *event handler*, dan sebagainya.
76+
* Dalam rendering sisi server atau saat merender Komponen Server, `preload` hanya memiliki efek jika Anda memanggilnya saat me-*render* komponen atau dalam konteks asinkronisasi yang berasal dari rendering komponen. Pemanggilan lainnya akan diabaikan.
7777

7878
---
7979

80-
## Usage {/*usage*/}
80+
## Penggunaan {/*usage*/}
8181

82-
### Preloading when rendering {/*preloading-when-rendering*/}
82+
### Preloading awal saat me-render {/*preloading-when-rendering*/}
8383

84-
Call `preload` when rendering a component if you know that it or its children will use a specific resource.
84+
Panggil `preload` saat me-*render* komponen jika Anda mengetahui bahwa komponen tersebut atau anak komponen akan menggunakan sumber daya tertentu.
8585

8686
<Recipes titleText="Examples of preloading">
8787

88-
#### Preloading an external script {/*preloading-an-external-script*/}
88+
#### Preloading skrip eksternal {/*preloading-an-external-script*/}
8989

9090
```js
9191
import { preload } from 'react-dom';
@@ -96,11 +96,11 @@ function AppRoot() {
9696
}
9797
```
9898

99-
If you want the browser to start executing the script immediately (rather than just downloading it), use [`preinit`](/reference/react-dom/preinit) instead. If you want to load an ESM module, use [`preloadModule`](/reference/react-dom/preloadModule).
99+
Jika Anda ingin agar browser segera mengeksekusi skrip (bukan hanya mengunduhnya), gunakan [`preinit`](/reference/react-dom/preinit). Jika Anda ingin memuat modul ESM, gunakan [`preloadModule`](/reference/react-dom/preloadModule).
100100

101101
<Solution />
102102

103-
#### Preloading a stylesheet {/*preloading-a-stylesheet*/}
103+
#### Preloading stylesheet {/*preloading-a-stylesheet*/}
104104

105105
```js
106106
import { preload } from 'react-dom';
@@ -111,11 +111,11 @@ function AppRoot() {
111111
}
112112
```
113113

114-
If you want the stylesheet to be inserted into the document immediately (which means the browser will start parsing it immediately rather than just downloading it), use [`preinit`](/reference/react-dom/preinit) instead.
114+
Jika Anda ingin stylesheet disisipkan ke dalam dokumen dengan segera (yang berarti browser akan langsung mem-*parsing*-nya, bukan hanya mengunduhnya), gunakan [`preinit`](/reference/react-dom/preinit) sebagai gantinya.
115115

116116
<Solution />
117117

118-
#### Preloading a font {/*preloading-a-font*/}
118+
#### Preloading font {/*preloading-a-font*/}
119119

120120
```js
121121
import { preload } from 'react-dom';
@@ -127,11 +127,11 @@ function AppRoot() {
127127
}
128128
```
129129

130-
If you preload a stylesheet, it's smart to also preload any fonts that the stylesheet refers to. That way, the browser can start downloading the font before it's downloaded and parsed the stylesheet.
130+
Jika Anda melakukan *preload* stylesheet, sebaiknya Anda juga melakukan *preload* font apa pun yang dirujuk oleh stylesheet tersebut. Dengan begitu, browser dapat mulai mengunduh font sebelum mengunduh dan menguraikan stylesheet.
131131

132132
<Solution />
133133

134-
#### Preloading an image {/*preloading-an-image*/}
134+
#### Preloading gambar {/*preloading-an-image*/}
135135

136136
```js
137137
import { preload } from 'react-dom';
@@ -146,15 +146,15 @@ function AppRoot() {
146146
}
147147
```
148148

149-
When preloading an image, the `imageSrcSet` and `imageSizes` options help the browser [fetch the correctly sized image for the size of the screen](https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images).
149+
Saat memuat gambar secara *preload*, opsi `imageSrcSet` dan `imageSizes` membantu browser [mengambil gambar dengan ukuran yang tepat untuk ukuran layar](https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images).
150150

151151
<Solution />
152152

153153
</Recipes>
154154

155-
### Preloading in an event handler {/*preloading-in-an-event-handler*/}
155+
### Preloading pada event handler {/*preloading-in-an-event-handler*/}
156156

157-
Call `preload` in an event handler before transitioning to a page or state where external resources will be needed. This gets the process started earlier than if you call it during the rendering of the new page or state.
157+
Panggil `preload` dalam *event handler* sebelum bertransisi ke halaman atau state yang membutuhkan sumber daya eksternal. Hal ini akan memulai proses lebih awal dibandingkan jika Anda memanggilnya saat merender halaman atau state baru.
158158

159159
```js
160160
import { preload } from 'react-dom';

0 commit comments

Comments
 (0)