Image Optimization Script #348

Merged
a258wang merged 45 commits from amy-image-optimization into main 2 years ago
Owner

A build-time script to optimize images. Note that going forward, all images should be placed in images instead of public/images.

Staging: https://csclub.uwaterloo.ca/~a3thakra/csc/amy-image-optimization/

Future improvements:

  • Watch the images folder for updates, and automatically rebuild/refresh the page during development
  • Only re-optimize changed images when running the script?
  • Serve different sizes of images depending on user's screen size
A build-time script to optimize images. Note that going forward, all images should be placed in `images` instead of `public/images`. Staging: https://csclub.uwaterloo.ca/~a3thakra/csc/amy-image-optimization/ Future improvements: - Watch the images folder for updates, and automatically rebuild/refresh the page during development - Only re-optimize changed images when running the script? - Serve different sizes of images depending on user's screen size
a258wang added 7 commits 2 years ago
a258wang added 1 commit 2 years ago
3519e87e42 Change dependencies
a258wang added 1 commit 2 years ago
8cd3a7747b Remove unecessary dependency
a258wang changed title from Image Optimization Script to WIP: Image Optimization Script 2 years ago
a258wang added 1 commit 2 years ago
aa32e20c6e Rename npm scripts
a258wang added 1 commit 2 years ago
92eec34fa7 Remove imagePool constructor parameter
a258wang added 1 commit 2 years ago
f5adb69bdd Remove all libsquoosh code
a258wang added 1 commit 2 years ago
a258wang force-pushed amy-image-optimization from fddae28822 to 609d10732c 2 years ago
a258wang added 2 commits 2 years ago
a258wang added 1 commit 2 years ago
ecfbb721a5 Change order of build steps
a258wang added 1 commit 2 years ago
a7bf6f56a3 Fix CI step dependencies
a258wang added 2 commits 2 years ago
fbbfaf9fff Change pipeline steps order
a258wang added 1 commit 2 years ago
72cd1ee06c Change pipeline steps order for real
a258wang added 1 commit 2 years ago
388bf799ab Change pipeline steps order again
a258wang added 2 commits 2 years ago
a258wang added 1 commit 2 years ago
7408cf421a Add descriptive comment
a258wang added 1 commit 2 years ago
5b6a3e98ab Change build order
a258wang added 2 commits 2 years ago
a258wang added 1 commit 2 years ago
06123e8adb Merge branch 'main' into amy-image-optimization
a258wang force-pushed amy-image-optimization from 680d0a3d02 to b6cd0d3f35 2 years ago
a258wang changed title from WIP: Image Optimization Script to Image Optimization Script 2 years ago
Poster
Owner

I will revert that last commit before merging, after the PR has been approved.

I will revert that last commit before merging, after the PR has been approved.
a258wang added 4 commits 2 years ago
a258wang added 1 commit 2 years ago
411af4788d Merge branch 'main' into amy-image-optimization
a258wang changed title from Image Optimization Script to WIP: Image Optimization Script 2 years ago
a258wang added 1 commit 2 years ago
2ba4b58bfd Add debugging statement
a258wang added 1 commit 2 years ago
daa019abf9 Limit numberOfWorkers to maximum 8
a258wang added 2 commits 2 years ago
a258wang added 1 commit 2 years ago
4f54c51f06 Change numberOfWorkers to maximum 8 for real
a258wang added 1 commit 2 years ago
fc67cf138a Remove debugging statements
a258wang added 1 commit 2 years ago
658b2dafa9 Make PR reviewing easier again
a258wang changed title from WIP: Image Optimization Script to Image Optimization Script 2 years ago
Poster
Owner

The pipeline issues and memory errors should be hopefully be fixed now. I will revert that last commit before merging, after the PR has been reviewed and approved.

The pipeline issues and memory errors should be hopefully be fixed now. I will revert that last commit before merging, after the PR has been reviewed and approved.
a3thakra reviewed 2 years ago
const SOURCE_DIRECTORY = "images";
const DESTINATION_DIRECTORY = path.join("public", "images");
const TEAM_IMAGES_DIRECTORY = path.join("team", "");
Collaborator

isn't this supposed to be path.join("images", "team")

isn't this supposed to be `path.join("images", "team")`
Poster
Owner

getFilePathsInDirectory returns the paths of the files relative to the given directory, so the Meet the Team images would have filepaths like team/AdityaThakral.jpg. So the startsWith check on line 62 is checking to see if the filepath starts with team/.

`getFilePathsInDirectory` returns the paths of the files relative to the given directory, so the Meet the Team images would have filepaths like `team/AdityaThakral.jpg`. So the startsWith check on line 62 is checking to see if the filepath starts with `team/`.
Collaborator

can you add that as a comment in code?

can you add that as a comment in code?
a3thakra approved these changes 2 years ago
a3thakra left a comment
Collaborator

lgtm after you add that comment

lgtm after you add that comment
a3thakra reviewed 2 years ago
package.json Outdated
"scripts": {
"dev": "next dev",
"build": "npm run build:web && npm run generate:calendar",
"dev": "npm run build:images && next dev",
Collaborator

Let's not do this everytime. Instead, if someone adds a new image, they should run this locally to see their image. You should also something about adding and optimizing images to the docs.

Let's not do this everytime. Instead, if someone adds a new image, they should run this locally to see their image. You should also something about adding and optimizing images to the docs.
n3parikh approved these changes 2 years ago
const imagePaths = await getFilePathsInDirectory(SOURCE_DIRECTORY);
await fse.emptyDir(DESTINATION_DIRECTORY);
const numberOfWorkers = Math.min(cpus().length, 8);
Owner

Can you leave a comment about the 8?

Can you leave a comment about the 8?
a258wang added 2 commits 2 years ago
4a49919e26 Revert "Make PR reviewing easier again"
a258wang added 1 commit 2 years ago
0f0c636258 Remove image optimization from npm run dev
a258wang merged commit aae5c9adef into main 2 years ago
a258wang referenced this issue from a commit 2 years ago

Reviewers

a3thakra approved these changes 2 years ago
n3parikh approved these changes 2 years ago
continuous-integration/drone/push Build is passing
The pull request has been merged as aae5c9adef.
Sign in to join this conversation.
No Milestone
No project
No Assignees
3 Participants
Notifications
Due Date

No due date set.

Dependencies

No dependencies set.

Reference: www/www-new#348
Loading…
There is no content yet.