solomonhawk

3 Elixir Language Features I Love

We are truly privileged to select from a wide variety of programming languages that support different programming paradigms and offer various features.

I've been working more and more with Elixir over the past couple of years and have come to enjoy working in the functional paradigm. Here are a few of the features offered by the language that I love.

1. Immutable Data

• easy to use (reduces the # of things we have to load up into brain RAM)
• eliminates a large class of bugs related to mutation and shared state (both of which are critical to programs that do Interesting Things™)
• supportable by libraries if unavailable in host language

solomonhawk

My So Called "Dev Tools"

Softwares:

• iterm - terminal
• ohmyzsh - shell
• VS Code - editor
• Spectacle - window manager
• Sip - on screen color picker
• Evernote - notes

solomonhawk

Bold Text

*this is bold* 

===========================

Italic text

_this is italic_

solomonhawk

defmodule BlogDemo.Content.Block do
  use Ecto.Schema
  import Ecto.Changeset
  alias __MODULE__

  @derive {Jason.Encoder, []}
  embedded_schema do
    field :content, :map
    field :type, :string
    field :blocks, {:array, Block}, default: []

solomonhawk

Babel:

• Presets: babel-preset-es2015, babel-preset-react
• Plugins: babel-plugin-transform-runtime (polyfill: false) (https://babeljs.io/docs/plugins/transform-runtime/)
• Env (production) Presets: babel-preset-react-optimize

Syntax:

• ESLint
• Prettier

Testing:

solomonhawk

<ul>
<li class="share-text">Share this>/li>
<li class="share-tw"><a href="http://twitter.com/share?text=[title]"><span></span></a></li>
<li class="share-fb"><a href="http://www.facebook.com/sharer.php?u=/node/[nid]&p=[title]"><span></span></a></li>
<li class="share-pinterest"><a href="http://pinterest.com/pin/create/button/?url=/node/[nid]&description=[title]"><span></span></a></li>
</ul>

solomonhawk

This table shows Craft Template Profiling data before and after adding {% cache %} tags.

10 Iteration(s), 1 Worker(s): 110 Total Jobs	Before Avg. Time	After Avg. Time	Before Time STD	After Time STD	Before Avg. Queries	After Avg. Queries
/search/results?q=*	0.8409s	0.1132s (-86.5%)	41.022	0.762	40	13 (-67.5%)
/resources	0.8308s	0.1164s (-86.0%)	34.891	1.290	37	12 (-67.6%)
/collections	0.7083s	0.1520s (-78.5%)	12.069	0.678	52.1	15 (-71.2%)
/entry/page-block-testing	1.0612s	0.2314s (-78.2%)	8.968	1.58

solomonhawk

Viget Footer

solomonhawk

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Element

Box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
• elem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeight
• elem.getClientRects(), elem.getBoundingClientRect()

solomonhawk

javascript:(function(){function t(){this.types={}}function e(t,e){this.el=t,this.registry=e,this.init()}t.prototype={register:function(t){var e=t.type;this.types[e]=this.types[e]||[],this.types[e].push(t)},createNavigation:function(){var t=document.createElement("div");t.className="table-of-contents clearfix";var e=document.createElement("div");e.className="btn-group right",i.parentNode.insertBefore(t,i.nextSibling),t.appendChild(e),Object.keys(this.types).forEach(function(t){var i=!0,n=document.createElement("button");n.textContent=t,n.className="btn btn-sm selected",e.appendChild(n),n.addEventListener("click",function(e){i=!i,n.classList.toggle("selected",i),this.types[t].forEach(function(t){t.toggle(i)},this),e.preventDefault()}.bind(this))},this)}},e.prototype={init:function(){this.visible=!0,this.cacheElements(),this.addToggleButton(),this.bindEvents(),this.registerType()},cacheElements:function(){this.header=this.el.querySelector(".file-header"),this.actions=this.el.querySelector(".file-actions"),this.c