Skip to content

Instantly share code, notes, and snippets.

Avatar

Vasa vasanthk

View GitHub Profile
@vasanthk
vasanthk / draft.md
Created Apr 25, 2017 — forked from mpj/draft.md
Feedback for episode draft: 7 critical traits for a normal programmer
View draft.md

7 critical traits for a normal programmer

EARLY DRAFT FOR NEXT EPISODE, PLEASE PROVIDE FEEDBACK

This week I tweeted and tooted this question:

”What do you think are critical traits in a programmer? NOT to be super 10x or anything - just to feel good and function well professionally.”

Link to full threads here: [https://twitter.com/mpjme/status/855691565460848640]

View _1_"script async defer" blocks "load" event.md

Beware of <script async defer> blocking HTML "load" event

2015.10.07 t

On the importance of simulated latency testing, and bulletproofing your page from the third-party JS load failures

TL;DR

@vasanthk
vasanthk / async-defer-module.md
Created Mar 1, 2020 — forked from jakub-g/async-defer-module.md
async scripts, defer scripts, module scripts: explainer, comparison, and gotchas
View async-defer-module.md

<script> async, defer, async defer, module, nomodule, src, inline - the cheat sheet

With the addition of ES modules, there's now no fewer than 24 ways to load your JS code: (inline|not inline) x (defer|no defer) x (async|no async) x (type=text/javascript | type=module | nomodule) -- and each of them is subtly different.

This document is a comparison of various ways the <script> tags in HTML are processed depending on the attributes set.

If you ever wondered when to use inline <script async type="module"> and when <script nomodule defer src="...">, you're in the good place!

Note that this article is about <script>s inserted in the HTML; the behavior of <script>s inserted at runtime is slightly different - see Deep dive into the murky waters of script loading by Jake Archibald (2013)

@vasanthk
vasanthk / RootedTreeTraversal.js
Created Dec 16, 2015 — forked from dineshrajpurohit/RootedTreeTraversal.js
Preorder, Postorder,Inorder and Levelorder traversal of rooted trees using Javascript
View RootedTreeTraversal.js
/**
*
* Dinesh
*
* RootedTreeTraversal
* - Preorder Traversal
* - Postorder Traversal
* - Inorder Traversal
* - Levelorder Traversal
*
@vasanthk
vasanthk / es7-class.md
Created Nov 18, 2015 — forked from ericelliott/es7-class.md
Let's fix `class` in ES7
View es7-class.md

Two Simple Changes to Simplify class

I'm not suggesting drastic action. I don't want to break backwards compatibility. I simply want to make the class feature more usable to a broader cross section of the community. I believe there is some low-hanging fruit that can be harvested to that end.

Imagine AutoMaker contained class Car, but the author wants to take advantage of prototypes to enable factory polymorphism in order to dynamically swap out implementation.

Stampit does something similar to this in order to supply information needed to inherit from composable factory functions, known as stamps.

This isn't the only way to achieve this, but it is a convenient way which is compatible with .call(), .apply(), and .bind().

@vasanthk
vasanthk / books.md
Created Jan 6, 2016 — forked from bevacqua/books.md
Books I plan on buying this week
View books.md

Web Performance

  • High Performance Web Sites: Essential Knowledge for Front-End Engineers
  • High Performance JavaScript (Build Faster Web Application Interfaces)
  • Even Faster Web Sites: Performance Best Practices for Web Developers
  • Designing for Performance: Weighing Aesthetics and Speed

Web Design

  • Adaptive Web Design: Crafting Rich Experiences with Progressive Enhancement (2nd Edition) (Voices That Matter)
@vasanthk
vasanthk / pagination.md
Created Feb 2, 2016 — forked from mislav/pagination.md
"Pagination 101" by Faruk Ateş
View pagination.md

Pagination 101

Article by Faruk Ateş, [originally on KuraFire.net][original] which is currently down

One of the most commonly overlooked and under-refined elements of a website is its pagination controls. In many cases, these are treated as an afterthought. I rarely come across a website that has decent pagination, and it always makes me wonder why so few manage to get it right. After all, I'd say that pagination is pretty easy to get right. Alas, that doesn't seem the case, so after encouragement from Chris Messina on Flickr I decided to write my Pagination 101, hopefully it'll give you some clues as to what makes good pagination.

Before going into analyzing good and bad pagination, I want to explain just what I consider to be pagination: Pagination is any kind of control system that lets the user browse through pages of search results, archives, or any other kind of continued content. Search results are the o

View cf-ui-monorepo.md

cf-ui monorepo

Technical Decision

Build our UI framework inside a monorepo using Lerna.

TL;DR

Building npm packages across many individual repos make big changes difficult to make, test, and publish. Using a monorepo we can solve many of these and

View Reach Philosophy.md

Reach UI Philosophy

Reach UI is an accessible foundation for React applications and design systems.

The three equally important goals are to be:

  • Accessible
  • Composable
  • Stylable
@vasanthk
vasanthk / double-fetch-triple-fetch.md
Created Mar 1, 2020 — forked from jakub-g/double-fetch-triple-fetch.md
Will it double-fetch? Browser behavior with `module` / `nomodule` scripts
View double-fetch-triple-fetch.md