Обновить
18
Александр Серенко@fafnur

Senior Frontend Developer

21
Подписчики
Отправить сообщение

Хорошая статья для тех, кто создает свой UI KIT на Angular. Однако, достаточно сложный пример для разработчиков вне Angular.

Nox навсегда в моем сердечке

Возможно ChatGPT 4.5 и сгенерит то, что вам нужно.

А вообще, в Angular 17 все осталось как и было. Никаких изменений в nginx не требуется. Единственное universal стал частью ядра и это вносит некоторые изменения в сервер.

Жалко, что автор никак не упоминает Angular.

Тут может ответить только кто-то из Yandex. Поговори с @veged может он знает кого-то, кто поможет узнать :)

Если я догадался бы загуглить, что такое фрактальные деревья, то возможно пошел бы другим путем.

// drawTree.js
const getColor = function () {
    const colors = {};

    return function (level) {
        if(typeof colors[level] !== "undefined") {
            return colors[level];
        }
        const color = computeColor(level);
        colors[level] = color;

        return color;
    }
}();

const getWidth = function createComputeWidth() {
    const width = {};

    return function (level) {
        if(typeof width[level] !== "undefined") {
            return width[level];
        }
        const color = computeWidth(level);
        width[level] = color;

        return color;
    }
}();

function draw(startY, angle, level) {
    const startX = canvas.width / 2;
    const len = length * Math.pow(depth, level);

    ctx.beginPath();
    ctx.save();

    ctx.translate(level ? 0 : startX, startY);
    ctx.rotate(angle * Math.PI / 180);
    ctx.moveTo(0, 0);
    ctx.lineTo(0, -len);

    ctx.strokeStyle = getColor(level);
    ctx.lineWidth = getWidth(level);

    ctx.stroke();

    if (len < 10) {
        ctx.restore();
    }
}

function drawTree(startY, angle, level = 0) {
    const restore = '__restore__';
    const stack = [];
    stack.push([restore]);
    stack.push([startY, angle, level]);

    do {
        const [y, an, lev] = stack.pop();

        if(y === restore) {
            ctx.restore();
            continue;
        }

        const len = length * Math.pow(depth, lev);
        draw(y, an, lev);

        if (len >= 10) {
            stack.push([restore]);
            stack.push([-len, an - angleOffset, lev + 1]);
            stack.push([-len, an + angleOffset, lev + 1]);
        }
    } while (stack.length > 0);
}

Думаю, такое решение прошло бы.

Исходники для задачи можно взять тут github, спасибо за это @MihailPertsev.

Там только заменить drawTree.js на код, который представлен выше.

У меня решения не осталось. Там же была потрясающая, настроенная среда :). Можно попробовать восстановить решение.

Не считая первых двух, я сделал fractal-tree, но тоже не до конца. Я схлопнул рекурсию кроме сброса контекста, и долго не мог понять, как его запихнуть. В итоге решение пришло уже после завершения.

Еще мне понравилась задачка про веб-сокеты, но я понял, что не успею ее сделать и даже не брался.

Можно давать подобную задачку на собеседовании: "Напишите парсер числа из строки, используя массивы".

Никакого осуждения :) Вы успели сдать задачку и получить баллы, а я нет.

Немного тяжело читатается, но работает. Добавил в play.

Да, я увидел это еще в вашем решении.

Если переписать без обхода массива, то финальное решение немного укоротиться — play.

type Split<
  Value extends string,
  Pattern extends string = '->',
  Accumulation extends string[] = []
> = Value extends `${infer LValue}${Pattern}${infer RValue}`
    ? Split<RValue, Pattern, [...Accumulation, LValue extends `(${infer Start extends number}-${infer End extends number})`? Exclude<Enumerate<End>, Enumerate<Start>> : LValue]>
    : [...Accumulation, Value];

type Enumerate<
  Length extends number, 
  Accumulation extends number[] = []
> = Accumulation['length'] extends Length
  ? Accumulation[number]
  : Enumerate<Length, [...Accumulation, Accumulation['length']]>;

type ReadProperty<
  Record,
  Path
> = Path extends [first: infer FirstProperty extends keyof Record, ...args: infer OtherProperties]
  ? ReadProperty<Record[FirstProperty], OtherProperties>
  : Record;

type Get<T, Path extends string> = ReadProperty<T, Split<Path>>;

Так и есть. Один раз сталкивался с подобным.

Возьму на вооружение хвостовую рекурсию.

Эх, жалко.

Но задачка забавная, спасибо!

Решил почти так же, только Range чуть по другому - с флажком.

Интересный подход, даже не думал над таким. Все больше и больше хочу пройти type-challenges.

Да почти никак. Это такой своеобразный дзен, для ценителей.

Согласен, что для ценителей.

Просто иногда рассказываешь про возможности языка, что так можно, а еще и вот так. А тебе говорят, что на практике не применимо, бесполезная вещь. Охота иметь аргумент.

Ага, забыл про это.

Добавляю ссылку на финальное решение — typescriptlang.org/play.

Интересная вещь, стоит порешать. Спасибо за ссылку.

Composer это хорошо. Можно все автоматизировать и упростить.

Я больше говорил про сам процесс. Нужно что-то настраивать. Если в WP поддерживал миграции, то было бы проще.

Возможно миграции уже есть в ядре. Я работал с WP очень давно. Все развивается, даже Wordpress.

Например:

git pull
composer update
composer migrate

Затем все собрать в образ docker build . и выложить в прод.

Про логи согласен.

WP CLI слышу в первый раз. Но я не сильно погружался в экосистему WP.

Wordpress имеет место на существование и я никого не отговариваю от его использования. Если разобраться в тонкостях, достаточно сносное решение.

Можно раскрыть мысль, что конкретно несовместимо?

Я имел ввиду то, что нельзя просто делать `git pull` и считать, что все обновилось. Я не знаю, есть ли консольная команда, которая может обновить проект Wordpress-а.

Про файловую структуру тоже совершенно непонятно, она не меняется уже много лет.

Я видимо попал в тот момент, когда сверстал тему на основе базовой темы. И при одном обновлении эта тема изменилась. Возможно сейчас это не так.

Тоже что и выше – изменить константу в конфигурационном файле.

Локально все хорошо. Проблемы возникали в продакшене. Возможно у нас какие-то проблемы были с кластером и это косяки со стороны девопсов, но в любом случае это вызывало дискомфорт.

Логи не пробовали смотреть?

Вот это самая главная загадка - в логах было пусто. Я лично этим не занимался, могу лишь пересказывать слова коллег. Но в грейлоге я видел, что приложение Wordpress-а, иногда отдавала 500ю.

Информация

В рейтинге
Не участвует
Откуда
Новосибирск, Новосибирская обл., Россия
Дата рождения
Зарегистрирован
Активность

Специализация

Фронтенд разработчик
Старший
JavaScript
Angular
NestJS
Webpack
Redux
GraphQL
SCSS
TypeScript
Jest
CSS