MeFoDy

const audios = document.querySelectorAll('audio');
const tracks = [...audios].map((audio, i) => {
    const article = audio.parentNode;
    const title = article.querySelector('h2 a');
    const img = article.querySelector('img');

    return {
        pos: i,
        audio: audio,
        metadata: {

MeFoDy

WWW-аппликация

Контакты

• @dark_mefody
• n.a.dubko@gmail.com

Статьи

MeFoDy

---

date: 2020-04-27 title: 'TODO' language: ru hosts:

• Вадим Макеев
• Никита Дубко
• Ольга Алексашенко chapters:
• time: 00:00:00

MeFoDy

Статьи и руководства

1. Essential Image Optimization — Addy Osmani
2. Image Optimization — Ilya Grigorik
3. The Contrast Swap Technique: Improved Image Performance with CSS Filters — Una Kravets
4. Compressive Images Revisited — Tim Kadlec
5. w descriptors and sizes: Under the hood — Eric Portis
6. Lazy Loading Images and Video — Jeremy Wagner
7. How WebP Increases Your Web Performance — Dieter Petereit
8. [Lazy Loading Images for Performance Using Intersection

MeFoDy

Daily CSS Images

Week 1

Day 1. Bear Cub

The challenge begins! Don't overthink it. A cub can be made in only a few shapes.

Day 2. Elephant

MeFoDy

1. play.csssecrets.io/inner-rounding — sqrt
2. play.csssecrets.io/diamond-images — sqrt
3. play.csssecrets.io/bevel-corners — sqrt
4. play.csssecrets.io/folded-corner — sqrt
5. play.csssecrets.io/folded-corner-realistic — sqrt, sin, cos

sqrt(2) == cos(45deg) * 2

MeFoDy

{
    "parserOptions": {
        "ecmaVersion": 2017,
        "sourceType": "script",
        "ecmaFeatures": {
            "impliedStrict": true
        }
    },
    "env": {
        "node": true,

MeFoDy

/**
 * Calculate the luminance for a color.
 * See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests
 */
@function luminance($color) {
  $red: nth($linear-channel-values, red($color) + 1);
  $green: nth($linear-channel-values, green($color) + 1);
  $blue: nth($linear-channel-values, blue($color) + 1);

  @return .2126 * $red + .7152 * $green + .0722 * $blue;