krendeleno

Материалы к докладу "Анимации в браузере для самых маленьких"

CSS-анимации

01. Индивидуальные свойства transform

Полезные ссылки:

• CSS Individual Transform Properties in Safari Technology Preview
• Finer grained control over CSS transforms with individual transform properties

02. CSS animation

Примеры:

mbforbes

/**
 * An entity is just an ID. This is used to look up its associated
 * Components.
 */
export type Entity = number


/**
 * A Component is a bundle of state. Each instance of a Component is
 * associated with a single Entity.

subzey

import { createReadStream } from 'fs';

async function * splitLines(inputStream) {
    let carry = '';

    for await (const chunk of inputStream) {
        const lines = (carry + chunk).split('\n');
        carry = lines.pop();
        yield * lines;
    }

victor-homyakov

Приёмы оптимизации кода по скорости

Организационные

• Культура разработки performance-first: https://tonsky.me/blog/performance-first/
• Бюджет скорости: https://wp-rocket.me/blog/performance-budgets/
• Performance mantra: http://www.brendangregg.com/blog/2018-06-30/benchmarking-checklist.html

Не зависящие от языка и его реализации

• Rosetta Code - реализации задач на разных языках: http://rosettacode.org/wiki/Collections
• Статьи по основным структурам данных:

niquola

1 Software Design for Flexibility

Новая книга от одного из авторов культовой SICP (Gerald Jay Sussman) и principal author of Scheme (Chris Hanson) - «Software Design for Flexibility. How to Avoid Programming Yourself into a Corner». Авторы задаются «извечным» вопросом о гибкости кода и как ее достичь. Судя по оглавлению речь пойдет о различных техниках и подходах от комбинаторов до DSL и динамического программирования. Звучит очень интересно! https://mitpress.mit.edu/books/software-design-flexibility.

https://t.me/tripovozkiknig/62

2 Domain Modeling Made Functional

Книга про то как делать DDD методами функционального программирования (на F#, но многие аспекты применимы к ЯП без статической типизации)

threepointone

import { Suspense, useLayoutEffect, useRef, useState } from 'react';

type IFrameProps = React.ComponentPropsWithRef<'iframe'> & {
  fallback?: JSX.Element;
};

export function IFrame(props: IFrameProps) {
  const { fallback, ...rest } = props;

  return (

victor-homyakov

Код на React и TypeScript, который работает быстро

React

• Документация по React.memo: https://reactjs.org/docs/react-api.html#reactmemo
• Документация по useState: https://reactjs.org/docs/hooks-reference.html#usestate
• Исходный код ReactFiberBeginWork: https://github.com/facebook/react/blob/56e9feead0f91075ba0a4f725c9e4e343bca1c67/packages/react-reconciler/src/ReactFiberBeginWork.new.js#L3219
• React.js pure render performance anti-pattern: https://medium.com/@esamatti/react-js-pure-render-performance-anti-pattern-fb88c101332f
• Avoiding unnecessary renders with React context: https://frontarm.com/james-k-nelson/react-context-performance/
• The Secret parts of React New Context API: https://medium.com/@koba04/a-secret-parts-of-react-new-context-api-e9506a4578aa
• Why Did You Render: https://www.npmjs.com/package/@welldone-software/why-did-you-render

wentout

'use strict';

const myArrow = () => {};
const myFn = function () {};

class MyClass {};

const isArrowFunction = (fn) => {
	if (typeof fn !== 'function') {
		return false;

nekitk

CodePen Collection

Page Layout

1. Simple page layout
2. Animating grid (FireFox only)
3. Using instead of Bootstrap grid

Items list variations

4. Basic items list
5. Using explicit and implicit properties together

denisshevchenko

• A Type of Programming
• Algorithm Design with Haskell
• Beginning Haskell: A Project-Based Approach
• Developing Web Apps with Haskell and Yesod
• Functional Design and Architecture
• Get Programming with Haskell
• Haskell Book
• Haskell Cookbook
• Haskell Data Analysis Cookbook
• Haskell Design Patterns