Movatterモバイル変換


[0]ホーム

URL:


Skip to content
Search Gists
Sign in Sign up

Instantly share code, notes, and snippets.

View vasanthk's full-sized avatar

Vasanth Krishnamoorthy vasanthk

Engineering Manager • he/him • ❤️JS & Web Perf • 🎥Movie Buff •✈️ Backpacking • 🌱 Gardening • Lifelong Learner
View GitHub Profile
@vasanthk
vasanthk /notes.md
CreatedNovember 2, 2021 18:35— forked fromjsjoeio/notes.md
Julian's Writing Workshop - 11/2/2021 - Notes

These are my unstructured notes from the workshop. Read with caution (they're biased to my own interpretation).

Notes

1,000,000 Julian.com visitorsPart 1: What's your objective for your article?Part 2: pair it with an objectiveobjective + motivationgood nonfiction = 70% novelty + 25% story + 5% style

@vasanthk
vasanthk /AgileContractGuide.md
CreatedJuly 19, 2020 20:46— forked fromRobRuana/AgileContractGuide.md
Agile Contract Guide

This document is a guide to writing agile contracts. Unlike traditional contracts, an agile contract does not specify individual tasks to be completed by the Contractor. Rather, an agile contract specifies how the Client and Contractor interact, and how the Contractor is paid. The Deliverable Work performed for the contract is determined through an ongoing collaboration between the Client and the Contractor.

Agile contracts require a great deal of trust from both the Client and the Contractor. This trust is fostered through tight feedback cycles and well-defined responsibilities that both parties can expect from each other. More so than traditional contracts, an agile contract requires active participation from the Client.

@vasanthk
vasanthk /async-defer-module.md
CreatedMarch 1, 2020 09:48— forked fromjakub-g/async-defer-module.md
async scripts, defer scripts, module scripts: explainer, comparison, and gotchas

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 - seeDeep dive into the murky waters of script loading by Jake Archibald (2013)

@vasanthk
vasanthk /double-fetch-triple-fetch.md
CreatedMarch 1, 2020 07:19— forked fromjakub-g/double-fetch-triple-fetch.md
Will it double-fetch? Browser behavior with `module` / `nomodule` scripts

Testing double-fetching ofmodule/nomodule JS code (includingthe Safari hack)

<script type="module" src="module.js"></script><script nomodule src="nomodule.js"></script>

Test page:https://jg-testpage.github.io/es-modules/module-nomodule/

|IE/Edge|Firefox|Chrome|Safari |fetches module|fetches nomodule|executes| |

@vasanthk
vasanthk /_1_"script async defer" blocks "load" event.md
CreatedFebruary 9, 2020 20:59— forked fromjakub-g/_1_"script async defer" blocks "load" event.md
Beware of "script async defer" blocking HTML "load" event

2015.10.07t

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

TL;DR

@vasanthk
vasanthk /cloudSettings
CreatedFebruary 7, 2020 20:02
Visual Studio Code Settings Sync Gist
{"lastUpload":"2020-02-07T20:02:55.438Z","extensionVersion":"v3.4.3"}

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 /react.md
CreatedJanuary 1, 2019 19:21— forked fromlpalmes/react.md
React and Reconcilers in Reason

This is the base of all projects and it will include the foundation for all potential react-based projects in Reason.

This base package should include a ReasonReact api to promote collaboration and familiarity with people using a ReasonReact, and for the modern world of React this should also include a Hooks api that currently revery uses.

React module

All blocks in Jsx are of typeReact.reactElement. This reactElement should represent:

Introduction

Building reusable UI components is a non trivial task, as we need to anticipate a number of things when planing for reuseability. On the one end of the spectrum we want to enable customization and on the other side we want to avoid developers doing the wrong thing, like breaking the component or displaying invalid states.

To get a better understanding of what we need to think about and consider upfront, we will build a non-trivial UI component, that displays tags. OurTags component will take care of managing and displaying tags.

The following examples are all built withTachyons andReact, but these ideas apply to any UI component and any general styling approach.

NewerOlder

[8]ページ先頭

©2009-2025 Movatter.jp