Skip to content

Commit

Permalink
docs: sync Japanese translation (#458)
Browse files Browse the repository at this point in the history
docs: update Japanese translations
  • Loading branch information
koba04 authored Mar 7, 2023
1 parent 83fdad1 commit b9d9999
Show file tree
Hide file tree
Showing 3 changed files with 33 additions and 33 deletions.
2 changes: 1 addition & 1 deletion pages/docs/_meta.ja.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
"arguments": "引数",
"mutation": "ミューテーションと再検証",
"pagination": "ページネーション",
"subscription": "Subscription",
"subscription": "サブスクリプション",
"prefetching": "プリフェッチ",
"with-nextjs": "Next.js の SSG と SSR",
"typescript": "TypeScript",
Expand Down
8 changes: 4 additions & 4 deletions pages/docs/pagination.ja.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -318,10 +318,10 @@ const getKey = (pageIndex, previousPageData) => {
### Parallel Fetching Mode
<Callout emoji="✅">
Please update to the latest version (≥ 2.1.0) to use this API.
この API を利用するには最新バージョン (≥ 2.1.0) に更新してください。
</Callout>
The default behavior of useSWRInfinite is to fetch data for each page in sequence, as key creation is based on the previously fetched data. However, fetching data sequentially for a large number of pages may not be optimal, particularly if the pages are not interdependent. By specifying `parallel` option to `true` will let you fetch pages independently in parallel, which can significantly speed up the loading process.
useSWRInfinite のデフォルトの挙動は、キー作成を前のページのフェッチしたデータを元に行えるように各ページのフェッチを順番に行います。しかしながら、特にページのキー生成に依存関係がない場合ページ数が増えた場合においては 1 ページずつ順番にフェッチするのは最適な方法ではありません。`parallel` オプションを `true` にすることでページのフェッチがそれぞれ独立して並列に実行されるようになり、ローディング速度が劇的に向上します。
```jsx
// parallel = false (default)
Expand All @@ -332,7 +332,7 @@ The default behavior of useSWRInfinite is to fetch data for each page in sequenc
// page2 =====> done
// page3 ===> done
//
// previousPageData is always `null`
// previousPageData は常に `null`
const getKey = (pageIndex, previousPageData) => {
return `/users?page=${pageIndex}&limit=10`
}
Expand All @@ -343,7 +343,7 @@ function App () {
```
<Callout emoji="⚠️">
The `previousPageData` argument of the `getKey` function becomes `null` when you enable the `parallel` option.
`parallel` オプションを有効にした場合、`getKey` 関数の `previousPageData` 引数は `null` になります。
</Callout>
### Global Mutate with `useSWRInfinite`
Expand Down
56 changes: 28 additions & 28 deletions pages/docs/subscription.ja.mdx
Original file line number Diff line number Diff line change
@@ -1,36 +1,36 @@
import { Callout } from 'nextra-theme-docs'

# Subscription
# サブスクリプション

<Callout emoji="">
Please update to the latest version (≥ 2.1.0) to use this API.
この API を利用するには最新バージョン (≥ 2.1.0) に更新してください。
</Callout>

## `useSWRSubscription`

`useSWRSubscription` is a React hook that allows subscribing to real-time data sources with SWR.
`useSWRSubscription` はリアルタイムのデータソースを SWR で購読するための React フックです。

```tsx
useSWRSubscription<Data, Error>(key: Key, subscribe: (key: Key, options: { next: (error?: Error | null, data: Data) => void }) => () => void): { data?: Data, error?: Error }
```

### API

This hook subscribes to a real-time data source using the subscribe function provided, and returns the latest data received and any errors encountered. The hook automatically updates the returned data as new events are received.
このフックは提供された購読関数を使ってリアルタイムのデータソースを購読し、受け取った最新のデータや発生したエラーを返します。このフックは新しいイベントを受け取った時には自動的に更新されたデータを返します。

#### Parameters
#### 引数

- `key`: A unique key that identifies the data being subscribed to, same key as `useSWR` key.
- `subscribe`: A function that subscribes to the real-time data source. It receives the key and an object with the following properties:
- `key`: 購読するデータを示すユニークなキー。`useSWR` `key` と同様
- `subscribe`: リアルタイムデータソースを購読する関数。キーと次のプロパティを持つオブジェクトを受け取る


`subscribe` arguments
- `next`: A function that accepts an error and data, and updates the state with the latest data received from the real-time data source.

`subscribe` returns a function that unsubscribes from the real-time data source.
`subscribe` 引数
- `next`: エラーとデータを受け取る関数で、リアルタイムデータソースからデータを受け取った時に状態を更新する

`subscribe` はリアルタイムデータソースの購読を解除するための関数を返します。

For instance

例えば

```tsx
function subscribe(key, { next }) {
Expand All @@ -40,26 +40,26 @@ function subscribe(key, { next }) {
```


#### Return Values
#### 返り値

- `state`: An object with the following properties:
- `data`: The latest data received from the real-time data source.
- `error`: An Error object if an error occurred while subscribing to the real-time data source, otherwise undefined.
- `state`: 次のプロパティを持つオブジェクト
- `data`: リアルタイムデータソースから受け取った最新のデータ
- `error`: リアルタイムデータソースの購読で発生したエラーのオブジェクト、もしくは `undefined`


When new data is received, the `error` will be reset to `undefined`.
新しいデータを受け取った時には、`error` `undefined` にリセットされます。

### Usage
### 利用方法

Using `useSWRSubscription` to subscribe to a Firestore data source:
`useSWRSubscription` を使って Firestore のデータソースを購読する

```tsx
import useSWRSubscription from 'swr/subscription'

function Post({ id }) {
const { data } = useSWRSubscription(['views', id], ([_, postId], { next }) => {
const ref = firebase.database().ref('views/' + postId)
ref.on('value',
ref.on('value',
snapshot => next(null, snapshot.data()),
err => next(err)
)
Expand All @@ -70,7 +70,7 @@ function Post({ id }) {
}
```

Using `useSWRSubscription` to subscribe to a WebSocket data source:
`useSWRSubscription` を使って WebSocket のデータソースを購読する

```tsx
import useSWRSubscription from 'swr/subscription'
Expand All @@ -82,18 +82,18 @@ function App() {
socket.addEventListener('error', (event) => next(event.error))
return () => socket.close()
})

if (error) return <div>failed to load</div>
if (!data) return <div>loading...</div>
return <div>hello {data}!</div>
}
```

### Deduplication
### 重複排除

`useSWRSubscription` deduplicates the subscription requests with the same key.
If there are multiple components using the same key, they will share the same subscription.
When the last component using the key unmounts, the subscription will be closed.
`useSWRSubscription` は同じキーを用いた購読リクエストに対して重複排除を行います。
複数のコンポーネントで同じキーを使っている場合には、それらは同じ購読処理を共有します。
最後のコンポーネントがアンマウントされた時に、購読は解除されます。

This means that if you have multiple components using the same key, they will all receive the same data.
And there's only one subscription to the real-time data source per key.
これは、もし複数のコンポーネントでそれぞれ同じキーに対する購読処理を行なっている場合には、全てのコンポーネントが同じデータを受け取ることを意味します。
加えて、リアルタイムデータソースに対しては、キー毎に一つだけ購読処理が登録されます。

1 comment on commit b9d9999

@vercel
Copy link

@vercel vercel bot commented on b9d9999 Mar 7, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

swr-site – ./

swr.vercel.app
swr-site.vercel.sh
swr-site-git-main.vercel.sh

Please sign in to comment.