{"id":509,"date":"2019-03-05T03:37:46","date_gmt":"2019-03-05T03:37:46","guid":{"rendered":"http:\/\/www.projectimmerse.com\/blog\/?p=509"},"modified":"2020-06-17T05:30:45","modified_gmt":"2020-06-17T05:30:45","slug":"an-intro-to-gzip-and-compression","status":"publish","type":"post","link":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/","title":{"rendered":"An intro to GZIP and compression"},"content":{"rendered":"

GZIP is one of those big words used in programming to generally describe compression. Then again, you end up asking what “compression<\/strong>” is in the context of programming and computers. These two terms can be a little intimidating to the noob and not until you’ve really implemented it, or experienced it first hand you won’t really know it’s true nature and the fundamental idea behind it. So let’s do that. <\/p>\n

We often see these two terms come up frequently during page speed optimizations. Software tools like GTMetrix<\/a> and Page Speed Insights<\/a>. If you’re running into page speed issues or a really slow loading page, these tools will recommend compressing your files. Alright so what does that mean?<\/p>\n

Alright, a lot actually. But in simple terms:<\/p>\n

\n

Compression is the process of encoding information using fewer bits. \u2014 Ilya Grigorik, Google<\/p>\n<\/blockquote>\n

<\/p>\n

Compression is much like how are data is passed through the wire or through waves. A little bit of physics knowledge can help you understand this actually. Think of how information is sent and their “states” once displayed. Behind the scenes are 1’s and 0’s, bits that can be rearranged in an efficient manner – in an order (or disorder) that can travel at efficient speeds. <\/p>\n

I mentioned “disorder” here because it relates to “Entropy”, yes we use the fundamental laws of the universe to compress data. I couldn’t find any information on the internet that explains the subject of compression well enough, aside from Wikipedia. This guy<\/a> explains it pretty well – I really like how he makes mention of “Entropy”. <\/p>\n

So you start with some text, something like this:<\/p>\n

\n“To be or not to be, that is the question”\n<\/p><\/blockquote>\n

Using compression, this text can be rearranged and encrypted resulting in something like this:<\/p>\n

\n“sdfsarr234234jcvwrwerrweklrj;lkwjer;lkwje;rlkjw”\n<\/p><\/blockquote>\n

Yeah, I know that looks cryptic – that’s the whole point. Don’t worry that’s what it looks like when it’s being passed through the wire or wirelessly. Once it gets to the browser client, that sentence is “decompressed” and arranged back to normal. Everything is all good and gravy. <\/p>\n

Note that all this magic doesn’t happen by default – some implementation is involved on your part, as the programmer. <\/p>\n

Below is a common implementation in an apache environment, within the .htaccess file. <\/p>\n

\r\n\r\n<IfModule mod_deflate.c>\r\n  # Compress HTML, CSS, JavaScript, Text, XML and fonts\r\n  AddOutputFilterByType DEFLATE application\/javascript\r\n  AddOutputFilterByType DEFLATE application\/rss+xml\r\n  AddOutputFilterByType DEFLATE application\/vnd.ms-fontobject\r\n  AddOutputFilterByType DEFLATE application\/x-font\r\n  AddOutputFilterByType DEFLATE application\/x-font-opentype\r\n  AddOutputFilterByType DEFLATE application\/x-font-otf\r\n  AddOutputFilterByType DEFLATE application\/x-font-truetype\r\n  AddOutputFilterByType DEFLATE application\/x-font-ttf\r\n  AddOutputFilterByType DEFLATE application\/x-javascript\r\n  AddOutputFilterByType DEFLATE application\/xhtml+xml\r\n  AddOutputFilterByType DEFLATE application\/xml\r\n  AddOutputFilterByType DEFLATE font\/opentype\r\n  AddOutputFilterByType DEFLATE font\/otf\r\n  AddOutputFilterByType DEFLATE font\/ttf\r\n  AddOutputFilterByType DEFLATE image\/svg+xml\r\n  AddOutputFilterByType DEFLATE image\/x-icon\r\n  AddOutputFilterByType DEFLATE text\/css\r\n  AddOutputFilterByType DEFLATE text\/html\r\n  AddOutputFilterByType DEFLATE text\/javascript\r\n  AddOutputFilterByType DEFLATE text\/plain\r\n  AddOutputFilterByType DEFLATE text\/xml\r\n\r\n  # Remove browser bugs (only needed for really old browsers)\r\n  BrowserMatch ^Mozilla\/4 gzip-only-text\/html\r\n  BrowserMatch ^Mozilla\/4\\.0[678] no-gzip\r\n  BrowserMatch \\bMSIE !no-gzip !gzip-only-text\/html\r\n  Header append Vary User-Agent\r\n<\/IfModule>\r\n\r\n<\/pre>\n
Let’s use this line for example:<\/p>\n
[javacript]<\/p>\n
 AddOutputFilterByType DEFLATE application\/javascript<\/p>\n
[\/javascript]<\/p>\n
Understanding the above should help you understand the rest of the lines, the same concept applies to it all. All were doing here is applying compression to all javascript files, this is what “application\/javascript” means. Each type uses a specific type of value so we can’t just use arbitrary names here.  <\/p>\n
For instance, if we want to compress HTML files we will use “text\/html” as the file type. <\/p>\n
Yes I know this is a lot of digest, but gaining a basic understanding of compression is a good start. Just know that compression has to do with rearranging information using bits and then rearranging them back in a human readable form using decompression. <\/p>\n","protected":false},"excerpt":{"rendered":"
GZIP is one of those big words used in programming to generally describe compression. Then again, you end up asking what “compression” is in the context of programming and computers. These two terms can be a little intimidating to the noob and not until you’ve really implemented it, or experienced it first hand you won’t … <\/p>\n
Continue reading “An intro to GZIP and compression”<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":1142,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-509","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized"],"yoast_head":"\nAn intro to GZIP and compression - Project Immerse<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"An intro to GZIP and compression - Project Immerse\" \/>\n<meta property=\"og:description\" content=\"GZIP is one of those big words used in programming to generally describe compression. Then again, you end up asking what “compression” is in the context of programming and computers. These two terms can be a little intimidating to the noob and not until you’ve really implemented it, or experienced it first hand you won’t … Continue reading "An intro to GZIP and compression"\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/\" \/>\n<meta property=\"og:site_name\" content=\"Project Immerse\" \/>\n<meta property=\"article:published_time\" content=\"2019-03-05T03:37:46+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-06-17T05:30:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2019\/03\/gzip-using-apache-and-htaccess.png\" \/>\n\t<meta property=\"og:image:width\" content=\"750\" \/>\n\t<meta property=\"og:image:height\" content=\"750\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"projectimmerse\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"projectimmerse\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/\"},\"author\":{\"name\":\"projectimmerse\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/#\\\/schema\\\/person\\\/c53f2864be524ee6fa08a7e4800dd1e5\"},\"headline\":\"An intro to GZIP and compression\",\"datePublished\":\"2019-03-05T03:37:46+00:00\",\"dateModified\":\"2020-06-17T05:30:45+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/\"},\"wordCount\":657,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/03\\\/gzip-using-apache-and-htaccess.png\",\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/\",\"url\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/\",\"name\":\"An intro to GZIP and compression - Project Immerse\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/03\\\/gzip-using-apache-and-htaccess.png\",\"datePublished\":\"2019-03-05T03:37:46+00:00\",\"dateModified\":\"2020-06-17T05:30:45+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/#\\\/schema\\\/person\\\/c53f2864be524ee6fa08a7e4800dd1e5\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/03\\\/gzip-using-apache-and-htaccess.png\",\"contentUrl\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/03\\\/gzip-using-apache-and-htaccess.png\",\"width\":750,\"height\":750,\"caption\":\"An intro to GZIP and compression\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/an-intro-to-gzip-and-compression\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"An intro to GZIP and compression\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/\",\"name\":\"Project Immerse\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/#\\\/schema\\\/person\\\/c53f2864be524ee6fa08a7e4800dd1e5\",\"name\":\"projectimmerse\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4d06955033d6227bfdcf30014e457e4334f7deeb73907de49b65ec2484921931?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4d06955033d6227bfdcf30014e457e4334f7deeb73907de49b65ec2484921931?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4d06955033d6227bfdcf30014e457e4334f7deeb73907de49b65ec2484921931?s=96&d=mm&r=g\",\"caption\":\"projectimmerse\"},\"url\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/author\\\/projectimmerse\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"An intro to GZIP and compression - Project Immerse","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/","og_locale":"en_US","og_type":"article","og_title":"An intro to GZIP and compression - Project Immerse","og_description":"GZIP is one of those big words used in programming to generally describe compression. Then again, you end up asking what “compression” is in the context of programming and computers. These two terms can be a little intimidating to the noob and not until you’ve really implemented it, or experienced it first hand you won’t … Continue reading \"An intro to GZIP and compression\"","og_url":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/","og_site_name":"Project Immerse","article_published_time":"2019-03-05T03:37:46+00:00","article_modified_time":"2020-06-17T05:30:45+00:00","og_image":[{"width":750,"height":750,"url":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2019\/03\/gzip-using-apache-and-htaccess.png","type":"image\/png"}],"author":"projectimmerse","twitter_card":"summary_large_image","twitter_misc":{"Written by":"projectimmerse","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/#article","isPartOf":{"@id":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/"},"author":{"name":"projectimmerse","@id":"https:\/\/www.projectimmerse.com\/blog\/#\/schema\/person\/c53f2864be524ee6fa08a7e4800dd1e5"},"headline":"An intro to GZIP and compression","datePublished":"2019-03-05T03:37:46+00:00","dateModified":"2020-06-17T05:30:45+00:00","mainEntityOfPage":{"@id":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/"},"wordCount":657,"commentCount":0,"image":{"@id":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/#primaryimage"},"thumbnailUrl":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2019\/03\/gzip-using-apache-and-htaccess.png","inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/","url":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/","name":"An intro to GZIP and compression - Project Immerse","isPartOf":{"@id":"https:\/\/www.projectimmerse.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/#primaryimage"},"image":{"@id":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/#primaryimage"},"thumbnailUrl":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2019\/03\/gzip-using-apache-and-htaccess.png","datePublished":"2019-03-05T03:37:46+00:00","dateModified":"2020-06-17T05:30:45+00:00","author":{"@id":"https:\/\/www.projectimmerse.com\/blog\/#\/schema\/person\/c53f2864be524ee6fa08a7e4800dd1e5"},"breadcrumb":{"@id":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/#primaryimage","url":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2019\/03\/gzip-using-apache-and-htaccess.png","contentUrl":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2019\/03\/gzip-using-apache-and-htaccess.png","width":750,"height":750,"caption":"An intro to GZIP and compression"},{"@type":"BreadcrumbList","@id":"https:\/\/www.projectimmerse.com\/blog\/an-intro-to-gzip-and-compression\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.projectimmerse.com\/blog\/"},{"@type":"ListItem","position":2,"name":"An intro to GZIP and compression"}]},{"@type":"WebSite","@id":"https:\/\/www.projectimmerse.com\/blog\/#website","url":"https:\/\/www.projectimmerse.com\/blog\/","name":"Project Immerse","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.projectimmerse.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.projectimmerse.com\/blog\/#\/schema\/person\/c53f2864be524ee6fa08a7e4800dd1e5","name":"projectimmerse","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/4d06955033d6227bfdcf30014e457e4334f7deeb73907de49b65ec2484921931?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/4d06955033d6227bfdcf30014e457e4334f7deeb73907de49b65ec2484921931?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/4d06955033d6227bfdcf30014e457e4334f7deeb73907de49b65ec2484921931?s=96&d=mm&r=g","caption":"projectimmerse"},"url":"https:\/\/www.projectimmerse.com\/blog\/author\/projectimmerse\/"}]}},"_links":{"self":[{"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/posts\/509","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/comments?post=509"}],"version-history":[{"count":3,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/posts\/509\/revisions"}],"predecessor-version":[{"id":1143,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/posts\/509\/revisions\/1143"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/media\/1142"}],"wp:attachment":[{"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/media?parent=509"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/categories?post=509"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/tags?post=509"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}