CSS
Intersection Observer Examples
Practical, real world examples of Intersection Observer
Blur Page
A browser extension to hide sensitive information on a web page
word-break: break-all vs word-wrap: break-word
style="width: ___" vs width="___"
Normalize vs Reset CSS
margin vs padding
display: none vs opacity: 0 vs visibility: hidden
display: none vs [hidden]
border vs outline
border-box vs content-box
:active vs :focus
DOM
Check Browsers Support
A browser extension to check browser compatibility without leaving your tab
Form Validation
The best validation library for JavaScript
stopImmediatePropagation vs stopPropagation
parentElement vs parentNode
nodeName vs tagName
naturalWidth vs width
mouseenter vs mouseover
keydown vs keypress vs keyup
key vs keyCode vs which
event.preventDefault vs return false
event bubbling vs capturing
DOMContentLoaded vs load
currentTarget vs target
clientY vs pageY
clientHeight vs offsetHeight vs scrollHeight
addEventListener() function vs on property
HTML
React PDF Viewer
A React component to view a PDF document
1 LOC
Favorite JavaScript utilities in single line of code
script async vs script defer
Element vs Node
<div> vs <section>
class vs id
<button> vs <input type="button" />
<b>, <i> vs <strong>, <em>
alt vs title
JavaScript
CSS Layout
A collection of popular layouts and patterns made with CSS
Front-end Tips
Super tiny, quick tips, tricks and best practices of front-end development
variable === undefined vs. typeof variable === "undefined"
undefined vs void
substr vs substring
string.charAt(i) vs string[i]
slice vs splice
++value vs value++
Object vs Map
object.property vs object['property']
Object.is() vs ===
Object.getOwnPropertyNames() vs Object.keys()
Number() vs parseInt()
null vs undefined
method in class constructor vs prototype
Map vs WeakMap
instanceof vs typeof
hasOwnProperty vs in
function declaration vs function expression
for ... in vs for ... of
== vs ===
encodeURI vs encodeURIComponent
double quotes vs single quote
delete obj.property vs obj.property = undefined
const vs let vs var
concat vs push
arrow vs regular function
array = [] vs array.length = 0
argument vs parameter
apply vs call
React
HTML DOM
How to manage HTML DOM with vanilla JavaScript
Responsive Design Patterns
A collection of patterns to create a responsive web page
<> vs React.Fragment
TypeScript
this VS that
The differences between _ and _ in the front-end development
string vs String
literal union type vs string enums
interface vs type
function vs property in interface
*.d.ts vs *.ts
const vs readonly
const enum vs enum
