docs: ✏️ Added page about external images

dc7290 · Jun 12, 2022 · 36422cc · 36422cc · vercel · Jun 12, 2022
1 parent b84dc5d
commit 36422cc
Show file tree

Hide file tree

Showing 12 changed files with 54 additions and 14 deletions.
diff --git a/docs/docs/01-intro.md b/docs/docs/01-intro.md
@@ -20,6 +20,7 @@ This makes it possible to build a high performance website with this solution, w
 - Optimize images at build time.
 - All options for `next/image` available
 - Convert formats (png → webp, etc.)
+- Download external images locally.
 - Using `sharp`, so it's fast.
 - Cache prevents repeating the same optimization
 - Support TypeScript
diff --git a/docs/docs/03-Features/01-external-images.md b/docs/docs/03-Features/01-external-images.md
@@ -0,0 +1,33 @@
+---
+description: This page introduces the handling of external images.
+---
+
+# External images
+
+This feature automatically downloads images locally if an external image URL is specified in src.  
+This, like the other features, works at build time and does not affect development speed.
+
+## Usage
+
+```jsx
+<Image src="https://next-export-optimize-images.vercel.app/og.png" width="1280" height="640" alt="" />
+```
+
+When in production, it will be rendered as follows. (Only important parts are shown.)
+
+```jsx
+<img
+  srcset="/_next/static/chunks/images/og_1920_75.png 1x, /_next/static/chunks/images/og_3840_75.png 2x"
+  src="/_next/static/chunks/images/og_3840_75.png"
+/>
+```
+
+During development, as with local images, no optimization is performed.
+Also, no downloading to local is performed.
+
+```jsx
+<img
+  srcset="https://next-export-optimize-images.vercel.app/og.png?width=1920 1x, https://next-export-optimize-images.vercel.app/og.png?width=3840 2x"
+  src="https://next-export-optimize-images.vercel.app/og.png?width=3840"
+/>
+```
diff --git a/docs/docs/03-Features/_category_.json b/docs/docs/03-Features/_category_.json
@@ -0,0 +1,9 @@
+{
+  "position": 3,
+  "className": "red",
+  "link": {
+    "type": "generated-index",
+    "title": "Features",
+    "description": "List of Main Features."
+  }
+}
diff --git a/...3-Configuration/01-basic-configuration.md → ...-Configurations/01-basic-configuration.md b/...3-Configuration/01-basic-configuration.md → ...-Configurations/01-basic-configuration.md
diff --git a/...-Configuration/02-plugin-configuration.md → ...Configurations/02-plugin-configuration.md b/...-Configuration/02-plugin-configuration.md → ...Configurations/02-plugin-configuration.md
diff --git a/docs/docs/03-Configuration/_category_.json → docs/docs/04-Configurations/_category_.json b/docs/docs/03-Configuration/_category_.json → docs/docs/04-Configurations/_category_.json
@@ -1,5 +1,5 @@
 {
-  "position": 3,
+  "position": 4,
   "className": "red",
   "link": {
     "type": "generated-index",

diff --git a/docs/docs/04-structure.md → docs/docs/05-structure.md b/docs/docs/04-structure.md → docs/docs/05-structure.md
diff --git a/docs/docs/05-comparison.md → docs/docs/06-comparison.md b/docs/docs/05-comparison.md → docs/docs/06-comparison.md
diff --git a/docs/docs/06-examples.md → docs/docs/07-examples.md b/docs/docs/06-examples.md → docs/docs/07-examples.md
diff --git a/docs/docs/08-planned-features.md b/docs/docs/08-planned-features.md
diff --git a/docs/docs/07-qa.md → docs/docs/08-qa.md b/docs/docs/07-qa.md → docs/docs/08-qa.md
diff --git a/docs/docs/09-planned-features.md b/docs/docs/09-planned-features.md
@@ -0,0 +1,10 @@
+---
+description: This page is to introduce examples of use.
+draft: true
+---
+
+# Planned Features
+
+:::caution
+There API is in the planning stage and is subject to change in practice.
+:::