Elm Radio

Elm Radio

By Dillon Kearns, Jeroen EngelsTechnology
Download on the App Store

Elm Radio episodes

  • 045: How We Learn
    • Make impossible states impossible
    • Teaching elm episode
    • Dillon's first Elm project, Mobster pair/mob programming timer
    Ideas for Effective Learning
    • Have a playground to try out ideas
    • Try a new tool or technique with a familiar problem or exercise
    • Small scale exercises and real world projects
    • Small scale exercises are helpful for quickly developing a skill
    • Feedback loops
    • Tiny steps shorten the feedback loop
    • Use code katas like bowling, tennis, roman numeral katas
    • Analogous to empirical scientific method (hypothesis, test, analyze)
    • Call your shot
    • Don't forget to analyze test results after
    • Listen to smart people, but come to your own conclusions
    • Try two alternate ways of doing something out for yourself
    • Failure is part of learning
    • Follow your curiosity
    • Look at the source for projects you depend on or come across
    • Growth Mindset vs. Fixed Mindset
    • You have to make knowledge your own (synthesis) - connect it to what you know
    • Just in time vs. just in case learning - focus on what you need or seems important now
    • Flexbox Froggy game
    • Demystify things (for example custom type constructors vs type alias constructors)
    • Mind mapping
    • Elm Radio Opaque Types episode
    • Zettlekasten second brain
    • How to Take Smart Notes book
    • Make declarative statements in second brain system
    • Dillon's use the platform note from his digital garden
    • Digital gardening
    • Learn in public movement
    • Richard Feldman's talk Scaling Elm Apps
    • Richard experimenting with dream writer in a component architect
    • Make It Stick book (and some notes summarizing key ideas)
    • Elm Radio API Design Lessons episode
    • Let your background processing do some work for you
    • Dan Pink's book When
    • Early bird vs night owl thinking
    • Jeroen's blog
    1 hr 14 min
  • 044: elm-webgl

    Guest: Andrey Kuzmin (github) (twitter)

    • elm-explorations/webgl
    • GLSL syntax
    • Two shaders: vertex shader and fragment shader
    • Uniforms are declarative bindings to Elm values. Type safe mapping
    • Simple cube example
    • elm-explorations/linear-algebra/latest
    • Projection matrices
    • elm-webgl-lessons
    • ianmackenzie/elm-3d-scene/latest/
    • Luca's listing of 3d Elm examples and resources
    • elm-3d-scene examples
    • elm-csg (Constructive solid geometry)
    • Elm Japan 3d SVG art
    • #gamedev and #webgl channels in Elm Slack
    • James Carlson's talk about communicating with the GPU from Elm using Futhark: Making Elm Talk to Your Personal Supercomputer
    • Andrey's elm-webgl-playground examples
    1 hr 4 min
  • 043: Teaching Elm with Richard Feldman
    • Richard Feldman (Twitter) (GitHub)
    • Richard's Elm book Elm in Action
    • Richard's Frontend Masters courses
    • Richard's talk Teaching Elm to Beginners
    • Find motivation
    • Mloc.js conference (by Prezi)
    • Pairing as a way to teach Elm
    • Intro to Elm Frontend Masters workshop exercises are open source
    • South Park therefore/but storytelling technique
    • "I like teaching things the wrong way and then showing what's wrong with it."
    • The importance of finding good examples
    • Training From the Back of the Room
    • Dillon's Elm JSON Decoder koans repo
    • Gradual release of responsibility technique
    • Brian's JSON Survival Kit book
    • NoRedInk jobs (looking for Elm and Haskell engineers)
    • Richard's Frontend Masters advanced Elm course and Elm intro course
    1 hr 21 min
  • 042: Comparing TypeScript and Elm's Type Systems
    • TypeScript and Elm have different goals
    • Soundness is not a goal of the TypeScript type system
    • TypeScript Design Goals (and non-goals)
    • TypeScript's any type
    • Nominal vs structural typing
    TypeScript's any vs. Elm's Debug.todo

    TypeScript's any essentially "turns off" type checking in areas that any passes through.

    In Elm:

    • You can get a type that could be anything with Debug.todo, but you can't build your app with --optimize if it has Debug.todo's in it
    • You will still get contradictions between inconsistent uses of a type that could be anything (see this Ellie example)

    This Ellie example (with compiler error as expected) and this TypeScript playground example (with no error) show the difference.

    • any can not be used in places that take never
    • any vs unknown
    • JSON.parse returns any, as do many core and published typings
    • io-ts lets you validate JSON similar to JSON decoders in Elm
    • Definitely Typed (published type definitions for NPM packages)
    • Definitely Typed search
    • noImplicitAny
    • TypeScript `strict mode in tsconfig
    • Dillon's post TypeScript's Blind Spots
    • JS semantics allow types that may not be intended (like adding a string + object, '' + {} === '[object Object]')
    • Function parameters are inferred to be any regardless of implementation if they aren't given an explicit type
    • Type narrowing
    • TypeScript has untagged unions (just called Unions) - in Elm, there are only tagged unions (called Custom Types)
    • Undefined vs null
    • TypeScript's Void type
    • TypeScript doesn't have checked exceptions like Java (there is a discussion about this on GitHub) - Elm only has explicit errors as data that must be handled exhaustively like other data types
    • Discriminated unions vs Elm custom types
    • Literal types
    • TypeScript allows number literal values, but arithemtic expressions return generic number values instead of literal types
    • Enums
    • Branded types in TypeScript vs opaque types
    • Elm Radio Opaque Types episode
    • Switch statements are not exhaustive - you can add an eslint rule to check that (or the never trick, assert unreachable)
    • Key of operator in TypeScript
    • TypeScript's type system can do some cool things that Elm can't (for better and for worse)
    • Prisma
    • Prisma advanced TS meetup talks
    • Tuples in TypeScript are just arrays and use narrowing - Tuple in Elm is a specific type
    • elm-ts-interop
    • TypeScript handbook on official site
    1 hr 9 min
  • 041: elm-markdown
    • dillonkearns/elm-markdown
    • Markdown was built to be friendly to humans more than parsers. Example of a markdown quirk for human-friendliness: numbered lists starting with 1 interrupt paragrpahs, starting with other numbers don't
    • Babelmark helps compare output of different markdown implementations
    • Some parts of the markdown spec are ambiguous
    • John Gruber created markdown (Daring Fireball)
    • Jeff Atwood pushed for CommonMark spec
    • CommonMark
    • GitHub-Flavored Markdown (gfm) is a superset of CommonMark (Auto-links, Todo syntax, tables, etc.)
    • Bear notes app (Mac only)
    dillonkearns/elm-markdown's Core Tools for Extensibility
    • Custom Renderers

    • Html handlers (example)

    • Transforming parsed Markdown Blocks (AST)

    • incrementalelm.com code for getting back references from parsed markdown

    • Jeroen's Hierarchy of Constraints note

    • Helpers for folding over Blocks and Inlines

    • Extracting table of contents example

    • Discussion to formalize HTML parsing and error handling spec in dillonkearns/elm-markdown

    • Example of unintuitive raw HTML tag handling in markdown: closed by whitespace (ignores closing tag)

    • Zettlekasten

    • Wikilinks

    • Foam Research

    • GFM Autolinks extension

    • elm-explorations/markdown

    • Matthew Griffith's elm-markup package

    • Matt's Oslo talk on fault tolerant parsing A Markup for the Statically Typed

    • elm-optimize-level-2

    • Shiki

    • Deckset

    • UnifiedJS markdown transformation ecosystem

    • elm-markdown-transforms

    • Render to a function (example)

    • Scheme evaluator example (demo) (code)

    • elm-pages 2.0 episode

    • Markdown announcement blog post Extensible Markdown Parsing in Pure Elm

    • #markdown channel in The Elm Slack

    • Example of extracting title and description from parsed markdown

    • Elm Online Meetdown

    • Submit a talk proposal to the Elm Online Call for Speakers form

    1 hr 8 min
  • 040: Phantom Builder Pattern
    • Phantom types (happens at compile time, not runtime)

    • Helps avoid things like adding centimeters and inches

    • ianmackenzie/elm-units

    • Joël Quenneville's phantom types talk from Elm in the Spring A Number by Any Other Name

    • Extensible records

    • Builder pattern

    • Jeroen's Hierarchy of Constraints

    • elm-graphql SelectionSet scope type variable

    • Builder Pattern episode

    • Brian Hicks' builder pattern talk Robot Buttons from Mars

    • with functions

    • Phantom builder is a state machine for your types

    • elm-review Rule API uses phantom builder

    • Phantom types discourse post on time package Simon Herteby

    • Snapshot test in Elm review for expected error messages

    • Phantom Builder live stream episode

    Possible operations with phantom extensible builders
    • Add a new field
    • Remove a field
    • Change the type of a field
    • Remove the previously existing phantom type and change it to an empty record (not extensible, just a hardcoded return type) i.e. Replace
    What you can do with phantom builder
    • Require something to be always called
    • Forbid something being called more than once
    • Cause other constraints dynamically after calling something
    • Make function calls mutually exclusive
    • Enable a function only if another one has been called
    1 hr 6 min
  • 039: elm-charts
    • Tereza Sokol (GitHub) (Twitter)
    • terezka/elm-charts
    • elm-charts.org
    • Original APIs: line-charts and elm-plot
    • Tereza's Elm Europe talk elm-plot: the big picture
    • Tereza's talk If Coco Chanel Reviewed Elm
    • Edward Tufte
    • New version tries to be less prescriptive
    • Extensible Web Manifesto
    • gampleman/elm-visualization
    • elm-vega
    • GHCJS (mentioned in Elm Town episode 6)
    57 min
  • 038: Lamdera
    • Mario Rogic (GitHub) (Twitter)

    • Lamdera

    • Lamdera 1.0 release

    • Elm Europe conference talk introducing Lamdera

    • Elm Europe conference talk about Lamdera's Evergreen

    Lamdera is about removing non-essential complexity - 6 concepts

    1. Stuff that happens for the client (in the browser)
    2. Stuff that happens in the server (like scheduled job)
    3. Data from client to backend
    4. Data from backend to client
    5. Frontend knows what it knows
    6. Backend knows what it knows
    • Lamdera docs
    • Semantic boundaries (remove glue code)
    • Real-time chat example app and other Lamdera example apps
    • Lamdera "Anti-Marketing" page
    • Lamdera Discord
    • elm-pkg-js spec
    • Elm Online meetdown group
    • Calls email sending service through HTTP
    • Martin Fowler's "Memory Image" idea
    • Event Sourcing
    • Martin Stewart talk introducing a Lamdera end-to-end testing tool
    • Wire size improvement in Lamdera alpha12 release notes
    • elm-webapp
    • Lamdera real world repo (PR 1) (PR 2)
    1 hr 32 min
  • 037: Performance in Elm
    • elm-review-performance
    • Tail call optimizations
    • Jeroen's blog post on Tail-call optimization in Elm
    • Evan Czaplicki's chapter on Tail-Call Optimization and how to write optimized code
    • Lighthouse Elm Radio episode
    • Ju Liu's Performant Elm blog post series
    • Avoid memoized state when possible to avoid stale data
    • Html.Lazy
    • Elm's html lazy only works when the function and args have the same reference as before. List.map will return a list with a new reference, for example.
    • Elm has function-level dead code elimination
    • Referencing a record pulls the whole record in no matter how many fields are used directly
    • bcp-47-language-tag package
    • Elm list extra gets split by function, unlike lodash which needs to be split
    • Elm Core Dict package has O(logn) complexity for operations like insert
    • JavaScript Objects aren't optimized for removing/adding properties
    • "What's Up With Monomorphism"
    • elm-optimize-level-2
    • elm-explorations/benchmark
    • Jeroen's list-extra PRs (with reference to the benchmark for it) for functions gatherWith isInfixOf
    • webpagetest.org (or web.dev performance testing)
    • Netlify Lighthouse plugin
    • RSLint - fast version of ESLint, but doesn't have custom rules
    • Instructions to minify Elm code
    • Jake and Surma talk about optimizing sites - Setting up a static render in 30 minutes
    • Jake Archibald's talk explaining JavaScript's event loop and requestAnimationFrame - In The Loop
    1 hr 9 min

About Elm Radio

From the publisher's feed

Tune in to the tools and techniques in the Elm ecosystem.