AUaudionerd·Jun 23, 2014Submission
A List of Resources for Server-Side Image Resizing
2 points · Open discussionadamdbradley
foresight.js
JavaScript2012–2014
adamdbradley / foresight.js
foresight.js
DEPRECATED: Prior to recent developments with the picture element, Foresight.js gaves webpages the ability to tell if the user's device is capable of viewing high-resolution images before the image is requested from the server. Additionally, it judges if the user's device currently has a fast enough network connection for high-resolution images. Depending on device display and network connectivity, foresight.js will request the appropriate image for the webpage.
6Distinct people
9Mentions
0Explicit recommenders
2.2KGitHub stars
What to know before exploring
What it is
DEPRECATED: Prior to recent developments with the picture element, Foresight.js gaves webpages the ability to tell if the user's device is capable of viewing high-resolution images before the image is requested from the server. Additionally, it judges if the user's device currently has a fast enough network connection for high-resolution images. Depending on device display and network connectivity, foresight.js will request the appropriate image for the webpage.
GitHub
Where it is used
No documented product use has been verified yet.
What people are saying
No recommendation phrase was found in the indexed comments.
No classified warning is attached to this page. Read the discussions before treating silence as approval.
Also in these discussions
No other repository is repeatedly linked in the same discussions.
This week on Hacker News
Nov 7–Nov 14 UTC · Direct repository links and separately labeled related project stories. Indexed through 11/14/2026, 3:56:07 PM UTC.
No direct repository links were found in the indexed HN discussions over the past seven days. Older discussions are available below.
Mentions over time
HN mentions by month9 dated mentions
Observed mentions: 2012-03-27 09:18:03 UTC to 2014-06-23 16:12:52 UTC.
Counts come from the repository’s dated source evidence. Index cutoff: 2026-11-02 08:16:59 UTC.
View mention counts and date ranges
| Period | Start (UTC) | End (exclusive, UTC) | Mentions | Submissions | Comments |
|---|---|---|---|---|---|
| Mar 2012 | 2012-03-01 00:00:00 UTC | 2012-04-01 00:00:00 UTC | 1 | 1 | 0 |
| Apr 2012 | 2012-04-01 00:00:00 UTC | 2012-05-01 00:00:00 UTC | 2 | 0 | 2 |
| May 2012 | 2012-05-01 00:00:00 UTC | 2012-06-01 00:00:00 UTC | 0 | 0 | 0 |
| Jun 2012 | 2012-06-01 00:00:00 UTC | 2012-07-01 00:00:00 UTC | 0 | 0 | 0 |
| Jul 2012 | 2012-07-01 00:00:00 UTC | 2012-08-01 00:00:00 UTC | 0 | 0 | 0 |
| Aug 2012 | 2012-08-01 00:00:00 UTC | 2012-09-01 00:00:00 UTC | 0 | 0 | 0 |
| Sep 2012 | 2012-09-01 00:00:00 UTC | 2012-10-01 00:00:00 UTC | 0 | 0 | 0 |
| Oct 2012 | 2012-10-01 00:00:00 UTC | 2012-11-01 00:00:00 UTC | 0 | 0 | 0 |
| Nov 2012 | 2012-11-01 00:00:00 UTC | 2012-12-01 00:00:00 UTC | 0 | 0 | 0 |
| Dec 2012 | 2012-12-01 00:00:00 UTC | 2013-01-01 00:00:00 UTC | 0 | 0 | 0 |
| Jan 2013 | 2013-01-01 00:00:00 UTC | 2013-02-01 00:00:00 UTC | 1 | 0 | 1 |
| Feb 2013 | 2013-02-01 00:00:00 UTC | 2013-03-01 00:00:00 UTC | 0 | 0 | 0 |
| Mar 2013 | 2013-03-01 00:00:00 UTC | 2013-04-01 00:00:00 UTC | 1 | 1 | 0 |
| Apr 2013 | 2013-04-01 00:00:00 UTC | 2013-05-01 00:00:00 UTC | 0 | 0 | 0 |
| May 2013 | 2013-05-01 00:00:00 UTC | 2013-06-01 00:00:00 UTC | 2 | 0 | 2 |
| Jun 2013 | 2013-06-01 00:00:00 UTC | 2013-07-01 00:00:00 UTC | 0 | 0 | 0 |
| Jul 2013 | 2013-07-01 00:00:00 UTC | 2013-08-01 00:00:00 UTC | 0 | 0 | 0 |
| Aug 2013 | 2013-08-01 00:00:00 UTC | 2013-09-01 00:00:00 UTC | 1 | 0 | 1 |
| Sep 2013 | 2013-09-01 00:00:00 UTC | 2013-10-01 00:00:00 UTC | 0 | 0 | 0 |
| Oct 2013 | 2013-10-01 00:00:00 UTC | 2013-11-01 00:00:00 UTC | 0 | 0 | 0 |
| Nov 2013 | 2013-11-01 00:00:00 UTC | 2013-12-01 00:00:00 UTC | 0 | 0 | 0 |
| Dec 2013 | 2013-12-01 00:00:00 UTC | 2014-01-01 00:00:00 UTC | 0 | 0 | 0 |
| Jan 2014 | 2014-01-01 00:00:00 UTC | 2014-02-01 00:00:00 UTC | 0 | 0 | 0 |
| Feb 2014 | 2014-02-01 00:00:00 UTC | 2014-03-01 00:00:00 UTC | 0 | 0 | 0 |
| Mar 2014 | 2014-03-01 00:00:00 UTC | 2014-04-01 00:00:00 UTC | 0 | 0 | 0 |
| Apr 2014 | 2014-04-01 00:00:00 UTC | 2014-05-01 00:00:00 UTC | 0 | 0 | 0 |
| May 2014 | 2014-05-01 00:00:00 UTC | 2014-06-01 00:00:00 UTC | 0 | 0 | 0 |
| Jun 2014 | 2014-06-01 00:00:00 UTC | 2014-07-01 00:00:00 UTC | 1 | 1 | 0 |
What Hacker News says
9 sourcesPilbox looks great. Added it to this list of such image resizing services:
https://github.com/adamdbradley/foresight.js/wiki/Server-Resizing-Images
Many, many implementations, and each goes about it differently. There's unfortunately no widely adopted standard for constructing a URL to request a resized/altered image.
It would be great to see traction on something like this RESTful Image API Specification:
https://github.com/riapi/riapi
In Pilbox: an image resizing application serverIt's not a bad solution, but I don't think it's the best solution. Obviously, the thing that sticks out as being the most inefficient is that the small (or default) image is always loaded. This means that for tablets and desktop browsers there will be an extra image request that is never used. Not too bad, but on a page with a lot of images this could add up.
I haven't personally tried it yet, but it seems the best option out there at the moment is the Capturing polyfill by Mozilla (https://hacks.mozilla.org/2013/03/capturing-improving-perfor...).
Another thing I would suggest the team think of is not loading images by browser width only. If we're tying these libraries to the idea that they improve performance by optimizing which images are loaded - so that you only transfer the necessary amount of KB per page view - browser width is a bi
Read the rest
t removed from what you want. What you actually want to measure is the user's network speed (which can be done with libraries like Foresight.js : https://github.com/adamdbradley/foresight.js). Loading large images on a slow network isn't going to be good for performance. By using both browser size and network speed, you can optimize images for mobile devices over 3G or those connected to WiFi. Or desktops on broadband versus desktops on 56k modems.
If you're considering the DIY server-side image resize route, here's a good list of options:
https://github.com/adamdbradley/foresight.js/wiki/Server-Resizing-Images
... and a comparison of benchmarks – ImageMagick vs. competitors like the very fast, low memory VIPS:
http://www.vips.ecs.soton.ac.uk/index.php?title=Speed_and_Memory_Use
In Ex-YouTube Man Builds Graphics Card for Entire InternetForesight.js - loading the right img size by device
2 points · Open discussionIt seems like all the current hi res solutions are somewhat hacky. I recently did a project with foresight.js (https://github.com/adamdbradley/foresight.js) I like how it tries to estimate the connection speed before serving up a 2x image.
In Sucking at RetinaThis library solves it by using a bit of specially-crafted html: https://github.com/adamdbradley/foresight.js
In Retina.js: Retina graphics for your websiteforesight.js looks more interesting since it takes the perceived connection speed into account when deciding to serve up 2x images. https://github.com/adamdbradley/foresight.js
In Retina.js: Retina graphics for your websiteForesight.js - Another responsive images technique
9 points · Open discussion