Skip to content

Instantly share code, notes, and snippets.

View nucliweb's full-sized avatar

Joan León nucliweb

961 followers · 551 following
View GitHub Profile
@nucliweb
nucliweb / custom-metrics.js
Created June 15, 2020 06:34 — forked from addyosmani/custom-metrics.js
custom-metrics.js
[lcp]
const po = new PerformanceObserver(() => {});
po.observe({type: 'largest-contentful-paint', buffered: true});
const lastEntry = po.takeRecords().slice(-1)[0];
return lastEntry.renderTime || lastEntry.loadTime;
[cls]
const po = new PerformanceObserver(() => {});
po.observe({type: 'layout-shift', buffered: true});
return po.takeRecords().reduce((val, entry) => val + entry.value, 0);
@nucliweb
nucliweb / FontUsageAnalyzer.js
Created May 23, 2020 15:40
Font Usage Analyzer
// Fork of https://github.com/paulcalvano/webfont-usage-analyzer/blob/master/Font_Analysis.js
// By Paul Calvanohttps://github.com/paulcalvano
// Font Usage Analyzer
// Parses CSS, Resource Timing and DOM to associate WebFont URLs with FontStacks.
// Allows for highlighting of font stacks correlating to WebFont URLs to examine where they are used on the page
// @author Paul Calvano
// @license MIT
// @copyright 2017 Akamai Technologies, Inc.
@nucliweb
nucliweb / meta-tags.md
Created April 3, 2020 07:07 — forked from whitingx/meta-tags.md
Complete List of HTML Meta Tags

Copied from http://code.lancepollard.com/complete-list-of-html-meta-tags/

Basic HTML Meta Tags

<meta charset='UTF-8'>
<meta name='keywords' content='your, tags'>
<meta name='description' content='150 words'>
<meta name='subject' content='your website's subject'>
<meta name='copyright' content='company name'>
@nucliweb
nucliweb / Image-Video-Optimization.md
Last active September 21, 2023 07:26
Twitter accounts you should follow if you like Image & Video Optimization
@nucliweb
nucliweb / OSX-disable-shadow-screenshot.md
Created August 29, 2019 15:09
disable the shadow added when capturing an entire window

Disable the shadow

You can disable the shadow added when capturing an entire window by executing the following command from the Terminal:

defaults write com.apple.screencapture disable-shadow -bool TRUE; killall SystemUIServer

Enable the shadow

@nucliweb
nucliweb / WebFont-Referents.md
Last active April 30, 2019 08:26
Web Font Referent
@nucliweb
nucliweb / index.html
Created October 19, 2018 07:30 — forked from yuanchuan/index.html
Alien land
<css-doodle>
:doodle {
@grid: 20x1 / 60vmin;
overflow: hidden;
}
:container {
transform: scale(25);
filter: @svg-filter(<svg>
<filter>
<feTurbulence baseFrequency="@r(.016, .056, .001)" seed="@r(100)" numOctaves="@r(8, 15)" />
@nucliweb
nucliweb / Hello-World.java
Created July 4, 2018 05:43
Code for "Aprender a programar con Processing y P5js" post
// Imprimir Hello, Works! en Java
public class Main {
public static void main(String[] args) {
System.out.println("Hello, World!");
}
}
@nucliweb
nucliweb / Animations.md
Last active June 8, 2018 05:45
@nucliweb
nucliweb / Optimizacion-Imagenes.md
Last active May 11, 2018 17:02
Temario para un curso de Optimización de imágenes para la web

Optimización de imágenes para la web

Sesión en abierto

Las imágenes representan más de un 60% del contenido del tráfico web. Desde los inicios de internet las hemos tenido presentes, lo curioso es que año tras año el porcentaje y peso está creciendo.

Mantener una buena optimización de las imágenes nos permitirá mejorar la experiencia de usuario.