People have overcome this problem by manually inspecting the Accept-Encoding request header for a dynamically served page and writing references to either original or compressed files accordingly using a naming convention like myscript.js and myscript.js.gz for regular and compressed files respectively.
1) Create a small gzipped file, gzipcheck.js.jgz, and make it available in CloudFront. This file should contain one line of code:
gzipEnabled = true;
If the file loads, it sets a flag, gzipEnabled, that indicates whether or not the browser supports gzip.
When you upload your files to S3/CloudFront, make sure to set the proper HTTP response headers on your files that end in .jgz:
And if you want browsers to cache your files forever (almost):
Cache-Control = max-age=315360000 Expires = Tue, 31 Dec 2019 20:00:00 GMT
Thanks to Ricardo Rangel who helped design and code this solution.
As of December 20, 2015, Amazon Web Services announced support for Gzipped CloudFront files! See Serving Compressed Files from their developer guide.