paritybit.ca

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs | README | LICENSE

commit 2dbfad8f4d9cf957b3946d7a92bd4b081a9af326
parent c642eda32d0389827552201d3bb2a764dae8233b
Author: Jake Bauer <jbauer@paritybit.ca>
Date:   Mon, 24 Feb 2020 22:44:27 -0500

Publish new blog post

Diffstat:
Mpages/blog.md | 1+
Apages/blog/making-my-own-vim-statusline.md | 108+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Mpages/home.md | 2++
Mpublic/feeds/blog-feed.xml | 112+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Mpublic/feeds/sitewide-feed.xml | 112+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Apublic/img/vim-airline.gif | 0
Apublic/img/vim-airline.mp4 | 0
Apublic/img/vim-no-airline.gif | 0
Apublic/img/vim-no-airline.mp4 | 0
Mpublic/sitemap.xml | 1+
10 files changed, 336 insertions(+), 0 deletions(-)

diff --git a/pages/blog.md b/pages/blog.md @@ -16,6 +16,7 @@ thoughts and ideas. You can find links to other blogs that I follow on my ### 2020 <ul> + <li>2020-02-24 <a href="blog/making-my-own-vim-statusline">Making My Own Vim Statusline</a></li> <li>2020-02-14 <a href="blog/urxvt-to-st">Switching from urxvt to st</a></li> <li>2020-02-06 <a href="blog/website-redesign">Making My Website More Accessible</a></li> </ul> diff --git a/pages/blog/making-my-own-vim-statusline.md b/pages/blog/making-my-own-vim-statusline.md @@ -0,0 +1,108 @@ +## Making My Own Vim Statusline + +[//]: # "After using a plugin to see what was taking the most time for my vim configuration to start, I decided to ditch airline and write my own statusline." + +[//]: # "main.min.css" + +[//]: # + +<div class="byline"> +<b>Written By:</b> Jake Bauer | + <b>Posted:</b> 2020-02-24 | + <b>Last Updated:</b> 2020-02-24 +</div> + +I was playing around with a plugin that I came across while browsing +[r/vim](https://old.reddit.com/r/vim) called +[vim-startuptime](https://github.com/dstein64/vim-startuptime). It's a vim +plugin by Daniel Steinberg ([dstein64](https://github.com/dstein64) on GitHub) +which measures the amount of time each component of your vim configuration takes +to load when you launch vim. This way, you can get an idea of what is taking the +most time and causing your previously-lightning-quick text editor to take what +feels like an eternity to become ready. + +I took 5 measurements, back to back, opening my vimrc and I noticed that my vim +configuration was taking roughly 132.35ms on average to finish loading (with a +standard deviation of 2.69ms). Although that sounds fast, it was definitely +noticeable as it was just past the [100ms commonly accepted +limit](https://www.nngroup.com/articles/response-times-3-important-limits/) for +a user interface to feel like it was responding instantaneously. Below is a +video showing a very clear and noticable delay when launching vim: + +<figure> + <video controls> + <source src="/img/vim-airline.mp4" type="video/mp4"> + Your browser does not support the video tag, try the download links below. + </video> +</figure> + +* [Download the mp4 video (310K)](/img/vim-airline.mp4) +* [Download a GIF (4.7M)](/img/vim-airline.gif) + +Although vim-startuptime showed me a graph of each component's execution time, +the statistics shown didn't reveal a specific component that could be causing +the startuptime to be this long. In fact, it appeared that it was the cumulative +effect of loading each of my plugins and parsing my vimrc which was causing the +overall startuptime to be noticeably long. So, I decided to figure out if this +was the case by experimenting. I removed all of my plugins (but kept my vimrc +the same) and, as expected, my startuptime dropped to the 20ms range. +One-by-one, I added my plugins back in. To my surprise, I noticed a huge jump in +startuptime when I added vim-airline back in. Vim-airline was the plugin that I +was using to display an aesthetically pleasing statusbar and buffer bar at the +bottom and top of my vim windows respectively and it was causing my startuptime +to effectively double! No other plugin had that drastic of an effect. + +I decided, then, that I was going to replace vim-airline with my own custom +statusline. + +I used a [blog post by +Irrellia](https://irrellia.github.io/blogs/vim-statusline/) to get me started +and found that it was actually really easy to make a good-looking and functional +statusline. About 100 lines of vimscript later and I had a customized statusline +that fulfilled my needs and looked really good (in my humble opinion). I also +put my custom statusline into a plugin folder in my `.vim/bundle/` directory so +that it would be automatically loaded by Pathogen as if it was a regular plugin. + +I will fully admit that I pretty much copied the colour scheme used in the +tutorial verbatim because I really liked the way it looked. Little did I know, +this would start a whole week of tinkering with my setup (I'll get into that in +an upcoming blog post). + +Something that I missed from vim-airline was that top line which displayed a +list of open buffers and highlighted the currently active buffer. I thought +about doing it myself but the implementation looked a little too complicated for +my mediocre vimscript skills. Instead, I replaced that specific functionality +with another, really lightweight plugin called +[vim-buftabline](https://github.com/ap/vim-buftabline). + +Once I was finished tinkering, I tested my new custom statusline (with the +vim-buftabline plugin too) using the same method which I used to test my +previous configuration and found that the average startup time had dropped to a +mere 66.85ms (with a standard deviation of 1.79ms)! That's a roughly 2 times +improvement in speed; it felt instantaneous again! Here, have a look at the +video below: + +<figure> + <video controls> + <source src="/img/vim-no-airline.mp4" type="video/mp4"> + Your browser does not support the video tag, try the download links below. + </video> +</figure> + +* [Download the mp4 video (310K)](/img/vim-no-airline.mp4) +* [Download a GIF (4.7M)](/img/vim-no-airline.gif) + +I've put my statusline in its own git repository which you can find [on +sourcehut](https://git.sr.ht/~jbauer/vim-fastline) or [on my self-hosted git +server](https://git.paritybit.ca/jbauer/vim-fastline). I've decided to call it +vim-fastline. I don't plan to do anything even remotely comparable to +vim-airline with it but I want to make it available in case others want to hack +on it. + +Not only was it fun and educational to program my own statusline, it had +significant performance benefits, and it now sort of feels like my vim +configuration is much more personal and not just a collection of plugins. It +feels like it's _"my configuration_" if that makes sense. I encourage you to +give it a try even if you're happy with your current configuration. + +Happy hacking! diff --git a/pages/home.md b/pages/home.md @@ -24,6 +24,8 @@ respectively. src="/img/feed-icon.png" width="15" height="15" alt="Click for RSS Feed"/> </a> </div> +2020-02-24 <a class="feed-item" href="blog/making-my-own-vim-statusline">New Blog Post: Making My Own Vim Statusline</a> + 2020-02-14 <a class="feed-item" href="blog/urxvt-to-st">New Blog Post: Switching from urxvt to st</a> 2020-02-06 <a class="feed-item" href="blog/website-redesign">New Blog Post: Making My Website More Accessible</a> diff --git a/public/feeds/blog-feed.xml b/public/feeds/blog-feed.xml @@ -7,6 +7,118 @@ <description>The latest blog posts from paritybit.ca. </description> <item> + <title>New Blog Post: Making My Own Vim Statusline</title> + <link>https://www.paritybit.ca/blog/making-my-own-vim-statusline</link> + <guid>https://www.paritybit.ca/blog/making-my-own-vim-statusline</guid> + <pubDate>Mon, 24 Feb 2020 22:42:05 -0500</pubDate> + <description><![CDATA[<h2>Making My Own Vim Statusline</h2> + +<div class="byline"> +<b>Written By:</b> Jake Bauer | + <b>Posted:</b> 2020-02-24 | + <b>Last Updated:</b> 2020-02-24 +</div> + +<p>I was playing around with a plugin that I came across while browsing +<a href="https://old.reddit.com/r/vim">r/vim</a> called +<a href="https://github.com/dstein64/vim-startuptime">vim-startuptime</a>. It's a vim +plugin by Daniel Steinberg (<a href="https://github.com/dstein64">dstein64</a> on GitHub) +which measures the amount of time each component of your vim configuration takes +to load when you launch vim. This way, you can get an idea of what is taking the +most time and causing your previously-lightning-quick text editor to take what +feels like an eternity to become ready.</p> + +<p>I took 5 measurements, back to back, opening my vimrc and I noticed that my vim +configuration was taking roughly 132.35ms on average to finish loading (with a +standard deviation of 2.69ms). Although that sounds fast, it was definitely +noticeable as it was just past the <a href="https://www.nngroup.com/articles/response-times-3-important-limits/">100ms commonly accepted +limit</a> for +a user interface to feel like it was responding instantaneously. Below is a +video showing a very clear and noticable delay when launching vim:</p> + +<p><figure> + <video controls> + <source src="/img/vim-airline.mp4" type="video/mp4"> + Your browser does not support the video tag, try the download links below. + </video> +</figure></p> + +<ul> +<li><a href="/img/vim-airline.mp4">Download the mp4 video (310K)</a></li> +<li><a href="/img/vim-airline.gif">Download a GIF (4.7M)</a></li> +</ul> + +<p>Although vim-startuptime showed me a graph of each component's execution time, +the statistics shown didn't reveal a specific component that could be causing +the startuptime to be this long. In fact, it appeared that it was the cumulative +effect of loading each of my plugins and parsing my vimrc which was causing the +overall startuptime to be noticeably long. So, I decided to figure out if this +was the case by experimenting. I removed all of my plugins (but kept my vimrc +the same) and, as expected, my startuptime dropped to the 20ms range. +One-by-one, I added my plugins back in. To my surprise, I noticed a huge jump in +startuptime when I added vim-airline back in. Vim-airline was the plugin that I +was using to display an aesthetically pleasing statusbar and buffer bar at the +bottom and top of my vim windows respectively and it was causing my startuptime +to effectively double! No other plugin had that drastic of an effect.</p> + +<p>I decided, then, that I was going to replace vim-airline with my own custom +statusline.</p> + +<p>I used a <a href="https://irrellia.github.io/blogs/vim-statusline/">blog post by +Irrellia</a> to get me started +and found that it was actually really easy to make a good-looking and functional +statusline. About 100 lines of vimscript later and I had a customized statusline +that fulfilled my needs and looked really good (in my humble opinion). I also +put my custom statusline into a plugin folder in my <code>.vim/bundle/</code> directory so +that it would be automatically loaded by Pathogen as if it was a regular plugin.</p> + +<p>I will fully admit that I pretty much copied the colour scheme used in the +tutorial verbatim because I really liked the way it looked. Little did I know, +this would start a whole week of tinkering with my setup (I'll get into that in +an upcoming blog post).</p> + +<p>Something that I missed from vim-airline was that top line which displayed a +list of open buffers and highlighted the currently active buffer. I thought +about doing it myself but the implementation looked a little too complicated for +my mediocre vimscript skills. Instead, I replaced that specific functionality +with another, really lightweight plugin called +<a href="https://github.com/ap/vim-buftabline">vim-buftabline</a>.</p> + +<p>Once I was finished tinkering, I tested my new custom statusline (with the +vim-buftabline plugin too) using the same method which I used to test my +previous configuration and found that the average startup time had dropped to a +mere 66.85ms (with a standard deviation of 1.79ms)! That's a roughly 2 times +improvement in speed; it felt instantaneous again! Here, have a look at the +video below:</p> + +<p><figure> + <video controls> + <source src="/img/vim-no-airline.mp4" type="video/mp4"> + Your browser does not support the video tag, try the download links below. + </video> +</figure></p> + +<ul> +<li><a href="/img/vim-no-airline.mp4">Download the mp4 video (310K)</a></li> +<li><a href="/img/vim-no-airline.gif">Download a GIF (4.7M)</a></li> +</ul> + +<p>I've put my statusline in its own git repository which you can find <a href="https://git.sr.ht/~jbauer/vim-fastline">on +sourcehut</a> or <a href="https://git.paritybit.ca/jbauer/vim-fastline">on my self-hosted git +server</a>. I've decided to call it +vim-fastline. I don't plan to do anything even remotely comparable to +vim-airline with it but I want to make it available in case others want to hack +on it.</p> + +<p>Not only was it fun and educational to program my own statusline, it had +significant performance benefits, and it now sort of feels like my vim +configuration is much more personal and not just a collection of plugins. It +feels like it's <em>"my configuration</em>" if that makes sense. I encourage you to +give it a try even if you're happy with your current configuration.</p> + +<p>Happy hacking!</p>]]></description> +</item> +<item> <title>New Blog Post: Switching from urxvt to st</title> <link>https://www.paritybit.ca/blog/urxvt-to-st</link> <guid>https://www.paritybit.ca/blog/urxvt-to-st</guid> diff --git a/public/feeds/sitewide-feed.xml b/public/feeds/sitewide-feed.xml @@ -7,6 +7,118 @@ <description>The feed that covers all notable additions, updates, announcements, and other changes for the entire paritybit.ca website.</description> <item> + <title>New Blog Post: Making My Own Vim Statusline</title> + <link>https://www.paritybit.ca/blog/making-my-own-vim-statusline</link> + <guid>https://www.paritybit.ca/blog/making-my-own-vim-statusline</guid> + <pubDate>Mon, 24 Feb 2020 22:42:05 -0500</pubDate> + <description><![CDATA[<h2>Making My Own Vim Statusline</h2> + +<div class="byline"> +<b>Written By:</b> Jake Bauer | + <b>Posted:</b> 2020-02-24 | + <b>Last Updated:</b> 2020-02-24 +</div> + +<p>I was playing around with a plugin that I came across while browsing +<a href="https://old.reddit.com/r/vim">r/vim</a> called +<a href="https://github.com/dstein64/vim-startuptime">vim-startuptime</a>. It's a vim +plugin by Daniel Steinberg (<a href="https://github.com/dstein64">dstein64</a> on GitHub) +which measures the amount of time each component of your vim configuration takes +to load when you launch vim. This way, you can get an idea of what is taking the +most time and causing your previously-lightning-quick text editor to take what +feels like an eternity to become ready.</p> + +<p>I took 5 measurements, back to back, opening my vimrc and I noticed that my vim +configuration was taking roughly 132.35ms on average to finish loading (with a +standard deviation of 2.69ms). Although that sounds fast, it was definitely +noticeable as it was just past the <a href="https://www.nngroup.com/articles/response-times-3-important-limits/">100ms commonly accepted +limit</a> for +a user interface to feel like it was responding instantaneously. Below is a +video showing a very clear and noticable delay when launching vim:</p> + +<p><figure> + <video controls> + <source src="/img/vim-airline.mp4" type="video/mp4"> + Your browser does not support the video tag, try the download links below. + </video> +</figure></p> + +<ul> +<li><a href="/img/vim-airline.mp4">Download the mp4 video (310K)</a></li> +<li><a href="/img/vim-airline.gif">Download a GIF (4.7M)</a></li> +</ul> + +<p>Although vim-startuptime showed me a graph of each component's execution time, +the statistics shown didn't reveal a specific component that could be causing +the startuptime to be this long. In fact, it appeared that it was the cumulative +effect of loading each of my plugins and parsing my vimrc which was causing the +overall startuptime to be noticeably long. So, I decided to figure out if this +was the case by experimenting. I removed all of my plugins (but kept my vimrc +the same) and, as expected, my startuptime dropped to the 20ms range. +One-by-one, I added my plugins back in. To my surprise, I noticed a huge jump in +startuptime when I added vim-airline back in. Vim-airline was the plugin that I +was using to display an aesthetically pleasing statusbar and buffer bar at the +bottom and top of my vim windows respectively and it was causing my startuptime +to effectively double! No other plugin had that drastic of an effect.</p> + +<p>I decided, then, that I was going to replace vim-airline with my own custom +statusline.</p> + +<p>I used a <a href="https://irrellia.github.io/blogs/vim-statusline/">blog post by +Irrellia</a> to get me started +and found that it was actually really easy to make a good-looking and functional +statusline. About 100 lines of vimscript later and I had a customized statusline +that fulfilled my needs and looked really good (in my humble opinion). I also +put my custom statusline into a plugin folder in my <code>.vim/bundle/</code> directory so +that it would be automatically loaded by Pathogen as if it was a regular plugin.</p> + +<p>I will fully admit that I pretty much copied the colour scheme used in the +tutorial verbatim because I really liked the way it looked. Little did I know, +this would start a whole week of tinkering with my setup (I'll get into that in +an upcoming blog post).</p> + +<p>Something that I missed from vim-airline was that top line which displayed a +list of open buffers and highlighted the currently active buffer. I thought +about doing it myself but the implementation looked a little too complicated for +my mediocre vimscript skills. Instead, I replaced that specific functionality +with another, really lightweight plugin called +<a href="https://github.com/ap/vim-buftabline">vim-buftabline</a>.</p> + +<p>Once I was finished tinkering, I tested my new custom statusline (with the +vim-buftabline plugin too) using the same method which I used to test my +previous configuration and found that the average startup time had dropped to a +mere 66.85ms (with a standard deviation of 1.79ms)! That's a roughly 2 times +improvement in speed; it felt instantaneous again! Here, have a look at the +video below:</p> + +<p><figure> + <video controls> + <source src="/img/vim-no-airline.mp4" type="video/mp4"> + Your browser does not support the video tag, try the download links below. + </video> +</figure></p> + +<ul> +<li><a href="/img/vim-no-airline.mp4">Download the mp4 video (310K)</a></li> +<li><a href="/img/vim-no-airline.gif">Download a GIF (4.7M)</a></li> +</ul> + +<p>I've put my statusline in its own git repository which you can find <a href="https://git.sr.ht/~jbauer/vim-fastline">on +sourcehut</a> or <a href="https://git.paritybit.ca/jbauer/vim-fastline">on my self-hosted git +server</a>. I've decided to call it +vim-fastline. I don't plan to do anything even remotely comparable to +vim-airline with it but I want to make it available in case others want to hack +on it.</p> + +<p>Not only was it fun and educational to program my own statusline, it had +significant performance benefits, and it now sort of feels like my vim +configuration is much more personal and not just a collection of plugins. It +feels like it's <em>"my configuration</em>" if that makes sense. I encourage you to +give it a try even if you're happy with your current configuration.</p> + +<p>Happy hacking!</p>]]></description> +</item> +<item> <title>New Blog Post: Switching from urxvt to st</title> <link>https://www.paritybit.ca/blog/urxvt-to-st</link> <guid>https://www.paritybit.ca/blog/urxvt-to-st</guid> diff --git a/public/img/vim-airline.gif b/public/img/vim-airline.gif Binary files differ. diff --git a/public/img/vim-airline.mp4 b/public/img/vim-airline.mp4 Binary files differ. diff --git a/public/img/vim-no-airline.gif b/public/img/vim-no-airline.gif Binary files differ. diff --git a/public/img/vim-no-airline.mp4 b/public/img/vim-no-airline.mp4 Binary files differ. diff --git a/public/sitemap.xml b/public/sitemap.xml @@ -3,6 +3,7 @@ <url><loc>https://www.paritybit.ca</loc></url> <url><loc>https://www.paritybit.ca/home</loc></url> <url><loc>https://www.paritybit.ca/blog</loc></url> + <url><loc>https://www.paritybit.ca/blog/making-my-own-vim-statusline</loc></url> <url><loc>https://www.paritybit.ca/blog/urxvt-to-st</loc></url> <url><loc>https://www.paritybit.ca/blog/website-redesign</loc></url> <url><loc>https://www.paritybit.ca/blog/automating-publishing</loc></url>