Skip to content

Instantly share code, notes, and snippets.

View maitrungdong's full-sized avatar
🎯
Focusing

Mai Trung Đông maitrungdong

🎯
Focusing
22 followers · 307 following
  • Ho Chi Minh, Viet Nam
  • 22:26 (UTC +07:00)
View GitHub Profile
@josethz00
josethz00 / sr-frontend-interview-questions-answered.md
Last active March 14, 2026 13:58
Sr. Frontend Interview Questions

Senior Frontend Interview Questions

Some questions about frontend development that might be in your next job interview. The questions were formulated by @mauvieira, a super senior fullstack developer

General Frontend

  • What are the strategies we can use to optimize the performance of web applications?

    • CDNs, GraphQL (maybe) to reduce overfetching, improve backend performance, use SSR and/or SSG, lazy loading for loading assets only when it's needed, minimize and compress HTML, CSS and JS files, and optimize images by compressing and resizing them.

  • What are Web Vitals (LCP, FID, CLS)? And how are they applied in the real world?

@paulirish
paulirish / log-all-mutations.js
Created January 25, 2023 22:44
Log all DOM mutations to console
// Log all DOM mutations to console.
// Modern interpretation of https://github.com/kdzwinel/DOMListenerExtension
observer = new MutationObserver(onMutation);
observerSettings = {
subtree: true,
childList: true,
attributes: true,
attributeOldValue: true,
@ladifire
ladifire / ExampleComponent.tsx
Created January 3, 2022 03:58
Demonstrate how to use Error boundary component in Reactjs
import React from 'react';
import { withErrorBoundary } from 'components/common/MartyErrorBoundary';
export const ExampleComponent = () => {
return (
<div>
Component
</div>
);
@pesterhazy
pesterhazy / indexeddb-problems.md
Last active March 12, 2026 21:01
The pain and anguish of using IndexedDB: problems, bugs and oddities

This gist lists challenges you run into when building offline-first applications based on IndexedDB, including open-source libraries like Firebase, pouchdb and AWS amplify (more).

Note that some of the following issues affect only Safari. Out of the major browsers, Chrome's IndexedDB implementation is the best.

Backing file on disk (WAL file) keeps growing (Safari)

When this bug occurs, every time you use the indexeddb, the WAL file grows. Garbage collection doesn't seem to be working, so after a while, you end up with gigabytes of data.

Random exceptions when working with a large number of indexeddb databases (Safari)

@TechFounder
TechFounder / style.css
Created June 27, 2016 03:05
Buddha bless your code to be bug free
//
// _oo0oo_
// o8888888o
// 88" . "88
// (| -_- |)
// 0\ = /0
// ___/`---'\___
// .' \\| |// '.
// / \\||| : |||// \
// / _||||| -:- |||||- \
@paulirish
paulirish / what-forces-layout.md
Last active March 17, 2026 07:48
What forces layout/reflow. The comprehensive list.

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.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
@nhagen
nhagen / PromisAllWithFails.js
Last active December 23, 2025 06:42
Wait until all promises have completed even when some reject, with Promise.all
var a = ["sdfdf", "http://oooooolol"],
handleNetErr = function(e) { return e };
Promise.all(fetch('sdfdsf').catch(handleNetErr), fetch('http://invalidurl').catch(handleNetErr))
.then(function(sdf, invalid) {
console.log(sdf, invalid) // [Response, TypeError]
})
.catch(function(err) {
console.log(err);
})
@marcoalexpinheiro
marcoalexpinheiro / CSS Rendered at GPU
Created June 11, 2013 14:41
Force CSS to be rendered in GPU
/* we apply a 3d transform just to improve rendering */
-webkit-transform:translateZ(0.1px);
-moz-transform:translateZ(0.1px);
-o-transform:translateZ(0.1px);
-ms-transform:translateZ(0.1px);
transform:translateZ(0.1px);
@paulirish
paulirish / rAF.js
Last active January 6, 2026 14:22
requestAnimationFrame polyfill
// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating
// requestAnimationFrame polyfill by Erik Möller. fixes from Paul Irish and Tino Zijdel
// MIT license
(function() {
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit', 'o'];