2021-09-05 09:58:19 +00:00
# Web2Img
Web2Img is a tool to bundle your web files into a single image, and extract them via Service Worker at runtime.
You can use image hosting sites as free CDNs to save bandwidth costs.
2021-09-06 08:27:49 +00:00
2021-09-05 09:58:19 +00:00
2021-09-06 08:27:49 +00:00
## Tool
2021-09-05 09:58:19 +00:00
2021-09-06 08:27:49 +00:00
Try It Online: https://etherdream.github.io/web2img/
2021-09-05 09:58:19 +00:00
2021-09-09 15:57:00 +00:00
OR: https://etherdream.com/web2img/ (latest)
2021-09-06 08:27:49 +00:00
https://user-images.githubusercontent.com/1072787/132183995-b342c3a8-1408-4819-923e-2d25fde419be.mp4
2021-09-05 09:58:19 +00:00
2021-09-06 08:27:49 +00:00
## Example
2021-09-05 09:58:19 +00:00
2021-09-06 08:27:49 +00:00
Demo: [https://fanhtml5.github.io ](https://fanhtml5.github.io )
2021-09-05 09:58:19 +00:00
2021-09-06 08:27:49 +00:00
Target Files: https://github.com/fanhtml5/fanhtml5.github.io (only 2 files)
2021-09-05 09:58:19 +00:00
2021-09-06 08:27:49 +00:00
Source Files: https://github.com/fanhtml5/test-site
2021-09-05 09:58:19 +00:00
## FAQ
2021-09-09 08:25:40 +00:00
Q: What if JavaScript is disabled?
A: Unfortunately, the page can't be displayed. You can add a fallback in `404.html` such as:
```html
< noscript >
< meta http-equiv = Refresh content = "0;url=FALLBACK_URL" >
< / noscript >
< script src = /x.js > < / script >
```
----
Q: What if the browser doesn't support Service Worker?
A: Same as above. The program will read the contents of `<noscript>` and render them.
----
2021-09-05 09:58:19 +00:00
Q: Is free CDN safe?
A: Yes, the program will verify the data integrity.
----
Q: Is free CDN stable?
A: Not sure, but you can provide multiple URLs to improve stability.
----
Q: Can any free CDN be used?
A: No, CDN must enable CORS, allow empty referrer and "null" origin (or real value).
----
Q: Would it be better to optimize the image before uploading?
2021-09-08 13:41:36 +00:00
A: If the server will re-encode the image, it makes no difference.
2021-09-05 09:58:19 +00:00
----
Q: Why use `404.html` ?
A: It's an easy way to intercept any path.
----
Q: How to update files?
A: Just overwrite `x.js` , the client polls this file every 2 minutes.
----
Q: Will new features be added?
2021-09-05 10:06:07 +00:00
A: This project is just an experiment, there is a new project named [freecdn ](https://github.com/EtherDream/freecdn ) which is much more powerful. (better docs will be released soon)
2021-09-05 09:58:19 +00:00
## License
2021-09-06 08:27:49 +00:00
MIT
