[skip prod] Convert all social uploads to WebP

Signed-off-by: Harsh Shandilya <msfjarvis@gmail.com>
This commit is contained in:
Harsh Shandilya 2020-02-03 11:29:15 +05:30
parent da1439c748
commit 5e9458123c
43 changed files with 19 additions and 19 deletions

View File

@ -6,7 +6,7 @@ slug = "adding-social-metadata-to-your-hugo-sites"
tags = ["hugo", "webdev", "static sites"]
title = "Adding social metadata to your Hugo sites"
description = "Optimize social media exposure with the right metadata for your site"
socialImage = "uploads/hugo_metadata_social.png"
socialImage = "uploads/hugo_metadata_social.webp"
+++
Metadata is data (information) about data.
@ -17,9 +17,9 @@ This metadata can be used by browsers (how to display content or reload page), s
Here's how your website will look like on Twitter with and without metadata.
![No metadata](/uploads/hugo_metadata_no_meta.png)
![No metadata](/uploads/hugo_metadata_no_meta.webp)
![Correct metadata](/uploads/hugo_metadata_correct_meta.png)
![Correct metadata](/uploads/hugo_metadata_correct_meta.webp)
You be the judge of what you like better :)

View File

@ -6,7 +6,7 @@ tags = ["android", "dagger", "tutorial"]
title = "Dagger the easy way - Part 1"
description = "Dagger is universally intimidating to beginners and I want to change it."
devLink = "https://dev.to/msfjarvis/dagger-the-easy-way-part-1-3l7b"
socialImage = "uploads/dagger_made_easy_social.png"
socialImage = "uploads/dagger_made_easy_social.webp"
+++
> Updated on 22 Jan 2020 with some additional comments from [@arunkumar_9t2](https://twitter.com/arunkumar_9t2). Look out for them as block quotes similar to this one.

View File

@ -6,7 +6,7 @@ slug = "dagger-the-easy-way--part-2"
tags = ["android", "dagger", "tutorial"]
title = "Dagger the easy way - Part 2"
description = "Let's extend the \"scope\" of these tutorials :)"
socialImage = "uploads/dagger_made_easy_social.png"
socialImage = "uploads/dagger_made_easy_social.webp"
+++
Welcome back! In this post I'm taking a bit of detour from my planned schedule to write about **scoping**. We'll _definitely_ cover constructor injection in the next part :)

View File

@ -5,7 +5,7 @@ slug = "deploying-hugo-sites-with-github-actions"
tags = ["hugo", "github actions", "static sites"]
title = "Deploying Hugo sites with GitHub Actions"
description = "GitHub Actions are awesome! Learn how to use it for continuous delivery of your static sites."
socialImage = "uploads/actions_social.png"
socialImage = "uploads/actions_social.webp"
+++
For the longest time, I have used the [caddy-git] middleware for [caddyserver](https://caddyserver.com) to constantly deploy my [Hugo](https://gohugo.io) site from [GitHub](https://github.com/msfjarvis/msfjarvis.dev).

View File

@ -6,7 +6,7 @@ tags = ["hugo", "static sites", "comments"]
title = "Integrating comments in Hugo sites with commento"
description = "Adding additional comment backends to Hugo is actually rather simple!"
devLink = "https://dev.to/msfjarvis/integrating-comments-in-hugo-sites-with-commento-136f"
socialImage = "uploads/commento_social.png"
socialImage = "uploads/commento_social.webp"
+++
Disqus is unequivocally the leader when it comes to hosted comments, and it works rather swimmingly with sites of all kinds with minimal hassle. But this ease has a gnarly flipside: [annoying referral links](https://stiobhart.net/2017-02-21-disqusting/) and a [huge bundle size](https://victorzhou.com/blog/replacing-disqus/) that significantly affects page load speeds.
@ -19,11 +19,11 @@ Commento is open source just like Isso, but has a cloud-hosted option. I was int
The interesting part! Hugo offers a Disqus template internally, but any other comment system's going to need some legwork done. Commento's integration code is just two lines, as you can see below.
![Commento.io integration code](/uploads/commento_integration.png)
![Commento.io integration code](/uploads/commento_integration.webp)
Hugo offers a powerful tool called [partials](https://gohugo.io/templates/partials/#use-partials-in-your-templates) that allows injecting code into pages from another HTML file. I quickly created a partial with the integration code, scoped out the domain with a variable, and ended up with this.
![Commento partial](/uploads/commento_partial.png)
![Commento partial](/uploads/commento_partial.webp)
With this saved as `layouts/partials/commento.html` and `CommentoURL` set in my `config.toml`, I set out to wire this into the posts. Because of a [pre-existing hack](https://github.com/msfjarvis/msfjarvis.dev/commit/5447bb36258934d6a5bc86be99ef91a9eeb9eb17) that I use for linkifying headings, I already had the `single.html` file from my theme copied into `layouts/_default/single.html`. If you don't, copy it over and open it. Add the following lines, removing any mention of Disqus if you find it.

View File

@ -6,7 +6,7 @@ slug = "my-dagger-story"
tags = ["android", "dagger"]
title = "My Dagger Story"
devLink = "https://dev.to/msfjarvis/my-dagger-story-2go0"
socialImage = "uploads/dagger_story_social.png"
socialImage = "uploads/dagger_story_social.webp"
+++
[Dagger](https://dagger.dev) is infamous for very good reasons. It's complicated to use, the documentation is an absolute shitshow, and simpler 'alternatives' exist. While [Koin](http://insert-koin.io/) and to a lesser extent [Kodein](https://kodein.org/di/) do the job, they're still service locators at their core and don't automatically inject dependencies like Dagger does.

View File

@ -6,7 +6,7 @@ tags = ["android", "gradle", "github", "packaging"]
title = "Publishing an Android library to GitHub Packages"
description = "GitHub recently rolled out Packages to the general public, allowing the entire develop-test-deploy pipeline to get centralized at GitHub. Learn how to use it to publish your Android library packages."
devLink = "https://dev.to/msfjarvis/publishing-an-android-library-to-github-packages-1l74"
socialImage = "uploads/github_packages_social.png"
socialImage = "uploads/github_packages_social.webp"
+++
GitHub released the Package Registry beta in May of this year, and graduated it to public availability in Universe 2019, rebranded as [GitHub Packages](https://github.com/features/packages "GitHub Packages"). It supports NodeJS, Docker, Maven, Gradle, NuGet, and RubyGems. That's a LOT of ground covered for a service that's about one year old.
@ -191,6 +191,6 @@ That's it! Once you push to GitHub, you'll see the [action running](https://gith
The requirement to authenticate for packages is a significant problem with GitHub Packages' adoption, giving an edge to solutions like [JitPack](https://jitpack.io) which handle the entire process automagically. As mentioned earlier, I did contact GitHub support about it and got this back.
![GitHub support reply about authentication requirement for packages](/uploads/github_packages_support_response.png)
![GitHub support reply about authentication requirement for packages](/uploads/github_packages_support_response.webp)
My interpretation of this is quite simply that **it's gonna take a while**. I hope not :)

View File

@ -6,7 +6,7 @@ tags = ["caddyserver", "goaccess", "analytics"]
title = "Server-side analytics with Goaccess"
description = "Analytics platforms are often overwhelming and a privacy nightmare -- here's how to bring analytics to the backend with very simple tooling"
devLink = "https://dev.to/msfjarvis/server-side-analytics-with-goaccess-pg8"
socialImage = "uploads/goaccess_social.png"
socialImage = "uploads/goaccess_social.webp"
+++
Analytics are a very helpful aspect of any development. They allow developers to know what parts of their apps are visited the most often and can use more attention, and for bloggers to know what content does or does not resonate with their readers.
@ -22,7 +22,7 @@ Goaccess is an **open-source**, **real-time** web log analyzer. In other words,
To create a compelling analytics experience, we'll need to use Goaccess' `--real-time-html` option, that creates an HTML report, and an accompanying `WebSocket` server that will dispatch a request to update the page data every time goaccess parses updated logs. When we're done, the result will look similar to [stats.msfjarvis.dev](https://stats.msfjarvis.dev), which shows statistics for my blog. Here's a peek at Goaccess' terminal visualizer, to get an idea about the datasets you can expect from the web version.
![Goaccess in the terminal](/uploads/goaccess_terminal.png)
![Goaccess in the terminal](/uploads/goaccess_terminal.webp)
Goaccess supports most common webserver log formats, and [some more](https://goaccess.io/man#options) with the option to provide your own format if you're using custom solutions. I'm using `VCOMMON`, as that is the default log format of my webserver of choice, [Caddy](https://caddyserver.com). Here's the command executed by the systemd unit that I use for goaccess. I'll explain every option in a bit.

View File

@ -6,7 +6,7 @@ tags = ["teachingkotlin", "android", "kotlin"]
title = "#TeachingKotlin - Kotlin for Android Java developers"
description = "Kotlin's been great for me -- and millions others, as evident by its explosive growth. Long-time Java developers may feel hesitant to give it a shot. This series aims to smoothen this transition, letting people know what benefits they might reap from Kotlin, and what differences should they be careful about."
devLink = "https://dev.to/msfjarvis/teachingkotlin-kotlin-for-android-java-developers-1fo3"
socialImage = "uploads/teachingkotlin_social.png"
socialImage = "uploads/teachingkotlin_social.webp"
+++
Anybody familiar with my work knows that I am a fan of the [Kotlin](https://kotlinlang.org/ "Kotlin") programming language, especially it's interoperability with Java with respect to Android. I'll admit, I've not been a fan since day one. The abundant lambdas worried me and everything being that much shorter to implement was confusing to a person whose first real programming task was in the Java programming language.

View File

@ -6,7 +6,7 @@ slug = "teaching-kotlin--classes-and-objects"
tags = ["android", "teachingkotlin", "kotlin"]
title = "#TeachingKotlin Part 1 - Classes and Objects and everything in between"
devLink = "https://dev.to/msfjarvis/teachingkotlin-part-1-classes-and-objects-and-everything-in-between-5bn0"
socialImage = "uploads/teachingkotlin_social.png"
socialImage = "uploads/teachingkotlin_social.webp"
+++
Classes in Kotlin closely mimic their Java counterparts in implementation, with some crucial changes that I will attempt to outline here.

View File

@ -6,7 +6,7 @@ tags = ["android", "teachingkotlin", "kotlin"]
title = "#TeachingKotlin Part 2 - Variables"
description = "The second post in #TeachingKotlin series, this post goes over Kotlin's variables and their attributes, like visibility and getters/setters."
devLink = "https://dev.to/msfjarvis/teachingkotlin-part-2-variables-2api"
socialImage = "uploads/teachingkotlin_social.png"
socialImage = "uploads/teachingkotlin_social.webp"
+++
Even the variables in Kotlin are supercharged!

View File

@ -6,7 +6,7 @@ slug = "teachingkotlin-part-3--caveats-coming-from-java"
tags = ["android", "teachingkotlin", "kotlin"]
title = "#TeachingKotlin Part 3 - Caveats coming from Java"
devLink = "https://dev.to/msfjarvis/teachingkotlin-part-3-caveats-coming-from-java-2e1k"
socialImage = "uploads/teachingkotlin_social.png"
socialImage = "uploads/teachingkotlin_social.webp"
+++
When you start migrating your Java code to Kotlin, you will encounter multiple subtle changes that might catch you off guard. I'll document some of these gotchas that I and other people I follow have found and written about.

View File

@ -6,7 +6,7 @@ tags = ["dev", "rust"]
categories = ["dev", "rust"]
description = "Rust is an amazing systems language that is on an explosive rise thanks to its memory safety guarantees and fast, iterative development. In this post, I recap some of the tooling that I use with Rust to make coding in it even more fun and intuitive"
devLink = "https://dev.to/msfjarvis/tools-for-effective-rust-development-3mb4"
socialImage = "uploads/rust_social.png"
socialImage = "uploads/rust_social.webp"
+++
[Rust] is a memory-safe systems language that is blazing fast, and comes with no runtime or garbage collector overhead. It can be used to build very performant web services, CLI tools, and even [Linux kernel modules](https://github.com/fishinabarrel/linux-kernel-module-rust)!

Binary file not shown.

Before

Width:  |  Height:  |  Size: 469 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 375 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 84 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 107 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 380 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 180 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 119 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 66 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 112 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 57 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 53 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB