Adam Butler

Founder of TechTalks - Contractor - Bristol JS organiser - Ruby & JavaScript Developer - Creative Coder - Hardware Hacker - More at

Pronoun(s): He/Him/His





What are TIL's?

TIL • acronym • Today I Learned

TIL stands for Today I Learned... it's a place to share knowledge, tips and tricks with other members in your community. Snippets are up to 1500 characters.

Today I learned that there is support for having in input that filters a list without any need for JavaScript.

<label for="myBrowser">Choose a browser from this list:
<input list="browsers" id="myBrowser" name="myBrowser" />
<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
  <option value="Microsoft Edge">

Checkout the Demo on CodePen.

Give credit when pairing

When you are pairing sometimes only the host gets credited for praise/blame with pairing commits.

Today I learned that you can add a co-author:

git commit -m "Commit description
Co-authored-by: John Smith <>"

Just add 2 blank lines then the co-author message in.

It will be shown like this in GitHub:

Debug an element by adding an ID of "test"

TIL thanks to a tweet from Devon Govett...

If you add an ID of "test" to an element:

<div id="test"></div>

You can access it using the global variable test from JS from the console. Could be handy for debugging.


Also, incase you dind't know, any highlighted selected in the "Elements" tab of developer tools can be accessed directly in the console with $0.

🐛 Happy debugging!

My CI was occasionally stacking up deployments. I wanted to share some simple optimisations that improved the deployment time of TechTalks from ~13 min to just 25 sec.

For context TechTalks is a Ruby on Rails app that runs Puma and Sidekiq on two t2.medium servers deployed with Capistrano by GitHub Actions.

1. Cache node_modules

🚀 Time saved ~4 min (I'm not sure why so much TBH)

append :linked_dirs, 'node_modules'

2. Cache webpacker output

🚀 Time saved ~6 min

I use Webpacker for packaging. All JS was being compiled everytime even if no changes had been made. I was vaguely aware this was a known issue. I didn't however know it was fixed but since my manifest.json and builds weren't retained between builds then it still built.

append :linked_dirs, 'public/packs'

3. Limit node memory

Our servers have 4GB RAM and currently no swap space (probably something I should look into).

Occasionally pre-compiling webpacker assets would run out of memory and cause the deploy to silently fail due to a default setting of webpack_compile_output: false in webpacker.yml which I changed. I also set an enviroment variable to tame this in the future:


Truncate an Array by setting its length

Today I Learned that in JavaScript an Array can be truncated by simply setting its length 🤯

Here is an example:

const myArray = [1, 2, 4, 8, 16, 32, 64, 128]
myArray.length = 4

// [1,2,4,8]

Subscribe to our newsletter

No spam. Just simple and infrequent platform updates when something big happens.

© 2024 Limited. All rights reserved.