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:
</label>
<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">
</datalist>

Checkout the Demo on CodePen.

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 <john.smith@acme.inc>"

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

It will be shown like this in GitHub:

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.

Bonus:

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:

NODE_OPTIONS=--max-old-space-size=512

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

console.log(myArray)
// [1,2,4,8]