Skip to content

Commit f680c9e

Browse files
updated readme
1 parent 926d4c8 commit f680c9e

File tree

1 file changed

+2
-13
lines changed

1 file changed

+2
-13
lines changed

README.md

Lines changed: 2 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ The plugin seamlessly integrates with your Netlify site, delivering high-quality
1111

1212
- [Prerequisites](#prerequisites)
1313
- [Setup ImageKit Netlify plugin](#setup-imagekit-netlify-plugin)
14-
- [How does it work?](#how-does-it-work)
1514
- [Limitations](#limitations)
1615
- [Support](#support)
1716
- [Links](#links)
@@ -91,17 +90,7 @@ npm install -D netlify-plugin-imagekit
9190
yarn add --dev netlify-plugin-imagekit
9291
```
9392

94-
## How does it work?
95-
After following above steps, the ImageKit plugin will work out of the box. Internally it uses the below mechanism to deliver highly optimized images.
96-
97-
### 1. Modify URLs in production-ready HTML files
98-
This is useful in scenarios where proper HTML files are generated after the build process. For these frameworks, the plugin taps into the `onPostBuild` hook, using `jsdom` to create a node-based representation of the DOM for each output HTML file. It then walks through each node, and upon finding an img or picture tag, it replaces the `src` or `srcset` path with an ImageKit URL.
99-
100-
While this approach works well for many situations, especially during the initial page load, it fails when using a framework with client-side routing or features that alter the DOM or that does not generate HTML files on build, such as `React`. This necessitates the use of the mechanism described below.
101-
102-
### 2. Redirect assets through the ImageKit Server
103-
104-
In this approach, all asset paths relative to the publish directory as `imagesPath` is specified. Then, using the redirect feature of [Netlify Redirects and rewrites](https://docs.netlify.com/routing/redirects/), we redirect the existing image URLs from the Netlify server to the ImageKit server. The ImageKit server fetches the original image, optimizes it, and then serves it back to the end user.
93+
After following the above steps, the ImageKit plugin will work out of the box. Internally, it uses the mechanism described [here](https://imagekit.io/docs/integration/netlify#how-does-it-work) to deliver highly optimized images.
10594

10695
## Limitations
10796

@@ -114,7 +103,7 @@ In this approach, all asset paths relative to the publish directory as `imagesPa
114103
For any feedback or to report any issues or general implementation support, please reach out to [[email protected]](mailto:[email protected])
115104

116105
## Links
117-
* [Documentation](https://imagekit.io/docs)
106+
* [Documentation](https://imagekit.io/docs/integration/netlify)
118107
* [Main website](https://imagekit.io)
119108

120109
## License

0 commit comments

Comments
 (0)