Merge pull request #3207 from matrix-org/MTRNord/reduce-media-size

Convert largest 5% of images to avif and animated webp

Author: MTRNord

content/blog/2014/11/2014-11-13-matrix-on-the-road.md

@@ -21,15 +21,15 @@ Three teams announced that they were using Matrix to build their hack but eventu
 
 Matrix team worked on <a href="http://challengepost.com/software/animatrix">Animatrix</a>: a chat app allowing you to build your own 3D animated cartoon and share it with any other friend using Matrix-compliant app using Unify. We had to hack together a basic Matrix Android client in order to do the demo .... You can see our project's presentation <a href="http://techcrunch.com/video/animatrix-presents-disrupt-sf-2014-hackathon/518404216/">here</a>!
 
-<a href="http://matrix.org/blog/wp-content/uploads/2014/11/IMG_48581.jpg"><img class="size-medium wp-image-195 aligncenter" src="http://matrix.org/blog/wp-content/uploads/2014/11/IMG_48581-300x225.jpg" alt="IMG_4858[1]" width="300" height="225" /></a>
+<a href="http://matrix.org/blog/wp-content/uploads/2014/11/IMG_48581.avif"><img class="size-medium wp-image-195 aligncenter" src="http://matrix.org/blog/wp-content/uploads/2014/11/IMG_48581-300x225.jpg" alt="IMG_4858[1]" width="300" height="225" /></a>
 
 The three days conference was great in terms of reaching out to devs and getting good feedback on Matrix! We love seeing people's eyes lighting up and people saying "Eventually someone is doing it!" when we explain what Matrix is about :) So thank you all for your support!
 
 ##### Disrupt Europe (London, UK - October 18-21)
 
 After getting public in SF, <a href="http://techcrunch.com/events/disrupt-eu/event-home/">Disrupt London </a>was the next steps to release a more stable version of Matrix and encourage even more people to build on Matrix. Again we sponsored both the Hackathon and the Conference and we brought with us a very cool <a href="http://www.trossenrobotics.com/phantomx-ax-hexapod.aspx" target="_blank">PhantomX robot from Trossen Robotics</a> which was also the price we gave away during the hackathon.
 
-<a href="http://matrix.org/blog/wp-content/uploads/2014/11/IMG_50191.jpg"><img class="size-medium wp-image-193 aligncenter" src="http://matrix.org/blog/wp-content/uploads/2014/11/IMG_50191-300x225.jpg" alt="IMG_5019[1]" width="300" height="225" /></a>
+<a href="http://matrix.org/blog/wp-content/uploads/2014/11/IMG_50191.avif"><img class="size-medium wp-image-193 aligncenter" src="http://matrix.org/blog/wp-content/uploads/2014/11/IMG_50191-300x225.jpg" alt="IMG_5019[1]" width="300" height="225" /></a>
 
 Two teams pitched a Matrix project at the <a href="http://techcrunch.com/events/disrupt-europe-hackathon-2014-london/">Hackathon </a>this time:
 

content/blog/2018/09/2018-09-01-this-week-in-matrix-2018-08-31.md

@@ -100,7 +100,7 @@ Version numbers! Now when you go to <a href="https://bintray.com/neilalexander/S
 
 There's also been some work on supporting dark mode on Mojave (which looks particularly sexy) and even Touch Bar support!
 
-<a href="/blog/wp-content/uploads/2018/08/mojave.jpg"><img class="aligncenter size-large wp-image-3516" src="/blog/wp-content/uploads/2018/08/mojave-1024x640.jpg" alt="" width="1024" height="640" /></a>
+<a href="/blog/wp-content/uploads/2018/08/mojave.avif"><img class="aligncenter size-large wp-image-3516" src="/blog/wp-content/uploads/2018/08/mojave-1024x640.jpg" alt="" width="1024" height="640" /></a>
 
 ### Riot Android v0.8.15
 

content/blog/2018/12/2018-12-25-the-2018-matrix-holiday-special.md

@@ -97,7 +97,7 @@ We'll keep you posted with progress as this lands over the coming months.
 
 However, as of today, we're super-excited to announce that Riot's redesign is at the point where the intrepid can start experimenting with it - in fact, internally most of the team has switched over to dogfooding (testing) the redesign as of a week or so ago.  Just shut down your current copy of Riot/Web or Desktop and go to <a href="https://riot.im/experimental">https://riot.im/experimental</a> instead if you want to experiment (we don't recommend running both at the same time).  Please note that it is still work-in-progress and there's a lot of polish still to land and some cosmetic bugs still hanging around, but it's definitely at the point of feeling better than the old app.  Most importantly, please provide feedback (by hitting the lifesaver-ring button at the bottom left) to let us know how you get on. See the <a href="https://medium.com/@RiotChat/redesign-experimenters-needed-afa7c2d4c858">Riot blog</a> for more details!
 
-<a href="/blog/wp-content/uploads/2018/12/Screenshot-2018-12-25-at-04.00.44.png"><img class="aligncenter size-large wp-image-3854" src="/blog/wp-content/uploads/2018/12/Screenshot-2018-12-25-at-04.00.44-1024x578.png" alt="" width="1024" height="578" /></a>
+<a href="/blog/wp-content/uploads/2018/12/Screenshot-2018-12-25-at-04.00.44.avif"><img class="aligncenter size-large wp-image-3854" src="/blog/wp-content/uploads/2018/12/Screenshot-2018-12-25-at-04.00.44-1024x578.png" alt="" width="1024" height="578" /></a>
 
 Meanwhile, on the performance and stability side of things - Lazy Loading (see above) made a <a href="https://medium.com/@RiotChat/riot-im-web-0-17-and-ios-0-7-6-smaller-footprint-faster-launch-5ddd18a65abb">massive difference</a> to performance on all platforms; shrinking RAM usage by 3-5x and similarly speeding up launch and initial sync times.  Ironically, this ended up pushing back the redesign work, but hopefully the performance improvements will have been noticeable in the interim.  We also <a href="https://github.com/vector-im/riot-web/issues/6477">switched</a> the entire rich text composer from using Facebook's <a href="https://draftjs.org/">Draft.js</a> library to instead use <a href="https://www.slatejs.org">Slate.js</a> (which has generally been a massive improvement for stability and maintainability, although took *<a href="https://github.com/matrix-org/matrix-react-sdk/pull/1890">ages</a>* to land - huge thanks to t3chguy for getting it over the line). Meanwhile Travis has been blitzing through a massive list of key “<a href="https://github.com/vector-im/riot-web/projects/12">First Impression</a>” bugs to ensure that as many of Riot's most glaring usability gotchas are solved.
 

content/blog/2019/02/2019-02-15-publishing-the-backend-roadmap.md

@@ -64,7 +64,7 @@ We found this sort of grid approach to be really helpful in determining relative
 After many hours and plenty of blood, sweat and tears we ended up with something we could live with and wrote it up in the <a href="https://github.com/orgs/matrix-org/projects/9">shared board</a>.
 
 
-<a href="/blog/wp-content/uploads/2019/02/IMG_2247.jpg"><img class="alignnone size-medium wp-image-3996" src="/blog/wp-content/uploads/2019/02/IMG_2247-300x225.jpg" alt="" width="300" height="225" /></a><a href="/blog/wp-content/uploads/2019/02/IMG_2245.jpg"><img class="alignnone size-medium wp-image-3990" src="/blog/wp-content/uploads/2019/02/IMG_2245-300x225.jpg" alt="" width="300" height="225" /></a>
+<a href="/blog/wp-content/uploads/2019/02/IMG_2247.avif"><img class="alignnone size-medium wp-image-3996" src="/blog/wp-content/uploads/2019/02/IMG_2247-300x225.jpg" alt="" width="300" height="225" /></a><a href="/blog/wp-content/uploads/2019/02/IMG_2245.avif"><img class="alignnone size-medium wp-image-3990" src="/blog/wp-content/uploads/2019/02/IMG_2245-300x225.jpg" alt="" width="300" height="225" /></a>
 
 ### And this is written in blood right?
 

content/blog/2019/06/2019-06-11-introducing-matrix-1-0-and-the-matrix-org-foundation.md

@@ -69,7 +69,7 @@ Massive massive thanks to everyone who has stuck with the project over the years
 
 Talking of which, we were looking through the photos we took from the first ever session hacking on Matrix back in May 2014…
 
-![Whiteboard 1](/blog/img/nightmare.jpg)
+![Whiteboard 1](/blog/img/nightmare.avif)
 
 ...suffice it to say that of the architectural options, we went with #3 in the end...
 

content/blog/2020/06/2020-06-19-this-week-in-matrix-2020-06-19.md

@@ -240,7 +240,7 @@ PS check out Valere trying the new features:
 >
 > * Notifications
 
-![2020-06-19-x8YxE-grafik.png](/blog/img/2020-06-19-x8YxE-grafik.png)
+![2020-06-19-x8YxE-grafik.avif](/blog/img/2020-06-19-x8YxE-grafik.avif)
 
 ### Rumatui is basically usable
 

content/blog/2020/07/2020-07-31-this-week-in-matrix-2020-07-31.md

@@ -190,7 +190,7 @@ Conduit is a Matrix homeserver written in Rust <https://conduit.rs>
 >
 > Adding new users weekly. Sign up for the [NovaChat beta](https://nova.chat). Or send me a DM @eric:nova.chat
 
-![2020-07-31-yJ-jJ-NovaChat-Newroomlist.gif](/blog/img/2020-07-31-yJ-jJ-NovaChat-Newroomlist.gif)
+![2020-07-31-yJ-jJ-NovaChat-Newroomlist.webp](/blog/img/2020-07-31-yJ-jJ-NovaChat-Newroomlist.webp)
 
 ### gomuks
 

content/blog/2020/10/2020-10-09-this-week-in-matrix-2020-10-09.md

@@ -229,7 +229,7 @@ These two projects combined should noticeably improve performance of matrix.org
 >
 > Finally, the improved widget support is looking very exciting. Here is a design grab to give you an idea of what to expect. Note this is not a real Element screen shot, the base functionality is there, but the look and feel of the final version is subject to change.
 
-![2020-10-09-oANj9-widgets.png](/blog/img/2020-10-09-oANj9-widgets.png)
+![2020-10-09-oANj9-widgets.avif](/blog/img/2020-10-09-oANj9-widgets.avif)
 
 [Michael (t3chguy)](https://matrix.to/#/@x:riot.ovh) added:
 
@@ -241,7 +241,7 @@ These two projects combined should noticeably improve performance of matrix.org
 
 > This week, Hydrogen gained better caching (and a little over-eager on Safari), room list filtering, a grid layout to show up to 6 rooms simultaneously (see screenshot) and work is well on its way for url-based navigation within the app.
 
-![2020-10-09-taU-L-hydrogen-grid.png](/blog/img/2020-10-09-taU-L-hydrogen-grid.png)
+![2020-10-09-taU-L-hydrogen-grid.avif](/blog/img/2020-10-09-taU-L-hydrogen-grid.avif)
 
 > also adding the screenshot on iOS that I didn't get in last week, showing the full range of display formats supported 🙂
 

content/blog/2020/11/2020-11-27-this-week-in-matrix-2020-11-27.md

@@ -87,7 +87,7 @@ image = "https://matrix.org/blog/img/2020-11-27-ml.png"
 >
 > We'll be working through some of the bridge oddities and hoping to open up the bridge to all public rooms on Gitter soon. You can track our full progress from the [GitLab epic for the native Gitter-Matrix bridge](https://gitlab.com/groups/gitterHQ/-/epics/10).
 
-![2020-11-27-sCDuB-ScreenShot2020-11-27at1.37.40AM.png](/blog/img/2020-11-27-sCDuB-ScreenShot2020-11-27at1.37.40AM.png)
+![2020-11-27-sCDuB-ScreenShot2020-11-27at1.37.40AM.avif](/blog/img/2020-11-27-sCDuB-ScreenShot2020-11-27at1.37.40AM.avif)
 
 ### MX-Puppet-VK (Na Zdorovie!)
 

content/blog/2021/02/2021-02-15-how-we-hosted-fosdem-2021-on-matrix.md

@@ -14,7 +14,7 @@ Hi all,
 
 Just over a week ago we had the honour of using Matrix to host FOSDEM: the world's largest free & open source software conference.  It's taken us a little while to write up the experience given we had to recover and catch up on business as usual... but better late than never, here's an overview of what it takes to run a ~30K attendee conference on Matrix!
 
-![](/blog/img/upload_5335e89b9ca474d844bdc37ea328967b.png)<small><center>*[confetti and firework easter-eggs explode over the closing keynote of FOSDEM 2021]*</center></small>
+![](/blog/img/upload_5335e89b9ca474d844bdc37ea328967b.avif)<small><center>*[confetti and firework easter-eggs explode over the closing keynote of FOSDEM 2021]*</center></small>
 
 First of all, a quick (re)introduction to Matrix for any newcomers: Matrix is an open source project which defines an open standard protocol for decentralised communication.  The global Matrix network makes up at least 28M Matrix IDs spread over around 60K servers.  For FOSDEM, we set up a fosdem.org server to host newcomers, provided by [Element Matrix Services (EMS)](https://ems.element.io) - [Element](https://element.io) being the startup formed by the Matrix core team to help fund Matrix development.