The following algorithm maximizes the size of the thumbnails in a grid as seen on Google+, Flickr, or Google images

image-gallery-layout.js

/**
 * The following algorithm maximizes the size of the thumbnails in a grid with an arbitrary width
 * Some examples of this algorithm are:
 * https://www.flickr.com/search/?q=landscapes
 * https://www.google.com/search?q=landscapes&source=lnms&tbm=isch
 * 
 * 
 * @param width {Number} the width of the viewport in the same unit as the size of the images
 * @param maxRowHeight {Number} the maximum allowed size of the row
 * @param images {Array} containing the size of each image in the following structure: [width, height]
 * @return {Array} of rows where each row contains the new size for each image
 * 
 * DEMO: http://jsbin.com/huhaja
 * */
function resize(width, maxRowHeight, images) {
  if (width <= 0) {
    return [];
  }
  if (maxRowHeight <= 0) {
    return [];
  }

  var aspectRatio = new Array(images.length);

  images.forEach(function(image, idx) {
     aspectRatio[idx] = image[0] / image[1];
  });

  function estimateSize(ith, widthRemaining, rowHeight, rowObj, sols) {
    if (ith >= images.length) {
      if (rowObj.length > 0) {
        sols.push(rowObj);
      }
      return;
    }
    if (rowHeight <= 0) {
      return;
    }

    rowHeight = Math.min(rowHeight, images[ith][1]);
    // compute the new size of the image
    var w = rowHeight*aspectRatio[ith];
    var h = rowHeight;

    rowObj.push([w, h]);

    var nextRemaining = widthRemaining - w;

    // if it went beyond the remaining width
    if (nextRemaining <= -1) {
      // compute a new height for the current row
      // recompute the position of each image in the current row
      estimateSize(
          ith - rowObj.length + 1, width,
          rowHeight * ( width / (width - nextRemaining),
          [],
          sols);
    } else if (nextRemaining >= 1) {
      // if the current row still has space available
      estimateSize(ith + 1, nextRemaining, rowHeight, rowObj, sols);
    } else {
      // add the row to the solution
      sols.push(rowObj);
      // move to the next image and restart values
      estimateSize(ith + 1, width, maxRowHeight, [], sols);
    }
  }

  var sols = [];
  estimateSize(0, width, maxRowHeight, [], sols);
  return sols;
}

// Example:
var viewportWidth = 100;
var maxRowHeight = 100;
resize(viewportWidth, maxRowHeight, [
  [80, 70], [90, 123], [178, 900], [90, 100], [512, 430], [320, 310]
]);
/** will output:
[ [ [ 60.57142857142857, 53 ], [ 38.78048780487805, 53 ] ],
  [ [ 18.016194331983808, 91.09311740890689 ],
    [ 81.9838056680162, 91.09311740890689 ] ],
  [ [ 100, 83.984375 ] ],
  [ [ 100, 96.875 ] ] ]
**/