14,954
edits
Speed up websites: Difference between revisions
Jump to navigation
Jump to search
→Image part
(Created page with " == Image part == Compression tools to reduce the file size of images * [https://tinypng.com/ TinyPNG – Compress WebP, PNG and JPEG images intelligently] == JavaScript part == Compression tools to reduce the file size of javascript * [http://jscompress.com/ Minify Javascript Online / Online JavaScript Packer]<ref>[https://www.minwt.com/webdesign-dev/html/18639.html JSCompress線上JS壓縮器，一鍵將多隻JS合併並壓縮|梅問題．教學網]</ref> * [https://p...") |
|||
| (6 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
== Image | == Measuring == | ||
[[Mobile friendliness tool]] | |||
== Image Compression == | |||
Compression tools to reduce the file size of images | Compression tools to reduce the file size of images | ||
* [https://tinypng.com/ TinyPNG – Compress WebP, PNG and JPEG images intelligently] | * [https://tinypng.com/ TinyPNG – Compress WebP, PNG and JPEG images intelligently] | ||
* Or using [https://imagemagick.org/index.php ImageMagick] to batch compress image files <ref>[https://stackoverflow.com/questions/27267073/imagemagick-lossless-max-compression-for-png ImageMagick: Lossless max compression for PNG? - Stack Overflow]</ref> | |||
ImageMagick: | |||
<pre> | |||
magick input.jpg -resize 2000x2000\> output.jpg | |||
</pre> | |||
ImageMagick {{kbd | key=<nowiki>\>:</nowiki>}} shrinks only, never enlarges — both dimensions scale proportionally | |||
ffmpeg: | |||
<pre> | |||
ffmpeg -i input.jpg -vf "scale=2000:-1:force_original_aspect_ratio=decrease" output.jpg | |||
# To cap the longer edge at 2000 | |||
ffmpeg -i input.jpg -vf "scale=2000:2000:force_original_aspect_ratio=decrease" output.jpg | |||
</pre> | |||
ffmpeg | |||
* {{kbd | key=<nowiki>scale=2000:-1</nowiki>}}: -1 already preserves aspect ratio; {{kbd | key=<nowiki>force_original_aspect_ratio=decrease</nowiki>}} ensures the longer edge never exceeds 2000, with the shorter edge calculated automatically | |||
* To cap both width and height at 2000 (e.g. for portrait images): {{kbd | key=<nowiki>scale=2000:2000</nowiki>}} | |||
== JavaScript part == | == JavaScript part == | ||
| Line 26: | Line 50: | ||
</pre> | </pre> | ||
{{Template:Build a website}} | |||
== Connection test == | |||
[[網路服務連線測試]] | |||
== References == | |||
<references /> | |||
[[Category:Programming]] | |||
[[Category:Web_Dev]] | |||
[[Category:Javascript]] | |||
[[Category:Design]] | |||