• Как узнать процент на сколько загрузилась страница и присвоить это значение переменной?

    @SaNFeeD
    Я бы попробовал так, как только заходят на страницу запускается функция
    setInterval(() => {}, 30);
    в которой все время прибавляется к полосе прогресса, например, по пикселю, попутно с этим проверяется document.readyState и если оно будет равно interactive то прогресс переходит заполняется на 2/3. Затем останавливаем интервал и ждем ответа следующей функции.
    window.onload = function(){};
    как только она сработает, плавно дотягиваем прогресс до конца и закрываем прелоадер.

    Можете почитать про события загрузки
    Ответ написан
    1 комментарий
  • Для чего следует использовать Vue.observable?

    Kozack
    @Kozack Куратор тега Vue.js
    Thinking about a11y
    Vue.observable позволяет создавать объекты, не привязанные к конкретному компоненту, изменения в которых будут вызывать перерисовку всех зависимых елементов.

    Грубо говоря, это более низкий уровень абстракции. Когда вы создаёте обект в секции data где-то там, внутри Vue используется Vue.observable. Просто сейчас эта функция стала доступной глобально
    Ответ написан
    2 комментария
  • Vue - вес проекта?

    Fragster
    @Fragster
    помогло? отметь решением!
    Попробуй вот такую штуку: https://habr.com/ru/company/jugru/blog/342842/
    Для того же moment есть приемы, которые исключат ненужные локали из сборки.
    fa - прям у них на сайте инструкция для vue: https://www.npmjs.com/package/@fortawesome/vue-fon...
    Опять же, можно заgzipить и получить размер раз в десять меньше.

    Судя по картинке из комментария. нужно взять https://github.com/vuetifyjs/vuetify-loader
    а также добавить new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/) в конфигурацию вебпака, чтобы отрезать локали moment.
    с highcharts, moment-timezone и popup надо гуглить, скорее всего тоже можно срезать.
    Ответ написан
    Комментировать
  • Как работать с большими массивами на php?

    FanatPHP
    @FanatPHP
    Чебуратор тега РНР
    Я думаю, самым разумным решением будет писать эти массивы в базу и сравнивать простым запросом. Именно так в общем случае решается задача "сравнение двух больших массивов данных на РНР." Конкретную же реализацию можно будет предложить только если будет конкретный вопрос, без "может быть " и "например".

    Да, память в БД тоже не бесплатная, но тут надо уже определиться - или мы хотим ворочать гигазы варезов, или сидеть на копеечном впс с 500 метрами памяти. Одновременно не получится.

    Можно конечно извернуться и скомпилить специальное расширение, которое как раз и предназначается для работы с иллимонами элементов, но опять же - все зависит от возможностей и потребностей.
    Ответ написан
    1 комментарий
  • Что значит Domain Driven Design?

    angrySCV
    @angrySCV
    machine learning, programming, startuping
    домен здесь означает предметную область знаний, эти знания (понимание процессов), являются основными при разработке.
    Тоесть никаких придуманных разработчиком абстракций, всяких там абстрактных модулей, факториКонструкторМенеджеров и тд, все максимально предметно и максимально приближенно к тому как реально процессы в компании работают.
    Если например разрабатывать систему учета в ресторане по ДДД, то в ней будет полностью скопированна структура самого ресторана, с названиями должностей, позиций, и процессов, без всяких там абстратных слоев и "удобных" нововведений. В итоге продукт получается сразу же понятный и привычный пользователям.
    Ответ написан
    2 комментария
  • Что делать, если ServiceWorker застрял в браузерах клиентов?

    evgensenin
    @evgensenin Автор вопроса
    Yii2 || Laravel, vue & nuxt
    Добавил в заголовки ответов АПИ
    clear-site-data: storage
    это сработает только если клиент обновит страницу
    и кэш будет всегда сбрасываться при обновлении страницы (это затрагивает localstorage и потому будет разлогин)
    Ответ написан
    1 комментарий
  • Метод call объекта-функции в js как работает?

    @abberati
    frontend-разработчик
    Давай по порядку

    const result = [].indexOf.call(this.children, event.target)


    []
    Пустой массив

    [].indexOf
    Метод массива. Он же функция. Если вызвать его как есть ([].indexOf(42)), то он будет искать в пустом массиве, следовательно ничего не найдёт. Он работает на this, то есть в теле этого метода this указывает на массив [], по this и происходят итерации для поиска. В случае [1,2,3].indexOf он внутри будет итерироваться по this, которое указывает на [1,2,3]

    [].indexOf.call
    Метод любой функции. Позволяет вызвать этот метод с явным указанием, чем будет являться this. В приведённом примере это this.children. Все остальные аргументы будут переданы в indexOf.

    Трюк в том, что метод indexOf есть только у массивов, но искать индекс этот метод может не только в массиве, но вообще в любой структуре, у которой есть поле length и остальные поля, доступные через численный ключ.

    Приведённая запись – способ вызвать метод массива на псевдомассиве.
    Ответ написан
    Комментировать
  • Не взяли на работу из-за неправильно выполненного тестового задания, посмотрите?

    @RuComMarket
    Битрикс FullStack разработчик
    что касается замечаний не скажу, но если они есть, то их должны объяснить.
    Тут скорее дело в другом, и причин может быть много.
    сейчас программистов способных что-либо путное писать единицы.
    Если задание выполнено и работает, если даже есть замечания, дальше ведут беседу выявляя, почему ты допустил "замечания" и вообще понял ли ты о них.
    Очень часто встречается когда среди отбирающих присутствует программист, с которого начинались разработки компании, и который сам не умеет программировать, но с учетом что он когда-то написал для компании "Hello World" ориентир руководства на его мнение. Он может по разным причинам отклонить:
    - может он не знает язык на столько, чтобы читать чужой код
    - может он не хочет что бы кто-то лучше него разбирающийся работал
    - может он вообще не хочет чтобы кто-то еще работал, но руководство дало задачу искать
    я таких моментов за свою практику встречал примерно в половине компаний с которыми сталкивался как в поиске работы, так и сотрудничая по другим задачам.

    Не стоит обращать внимания на такие компании и, главное, не опускать руки.
    за 40к питонщика возьмут любого, даже с "замечаниями", т.к. хороший питонщик на такие копейки просто даже не откликнется.
    ищи работу дальше, чтобы нарабатывать опыт. Если задаешь такие вопросы, думаю с таким подходом через годик другой увеличишь зарплатные запросы раза так в 3)
    Ответ написан
    2 комментария
  • Как создаются современные сайты?

    @Astrawelt
    Антон
    Сейчас многие современные верстальщики страдают какой-то небывалой дичью, засовывая тонны JS куда только можно и не можно.
    Пожалуй, мы ушли от простого: база данных, php и htm/css обвязка. Более того, тот же Гугл просит сайтостроителей делать простые и легкие сайты. А то порой дизайнеры такую ерунду в фотошопе нарисуют, что это никак не сверстать. И сайт получается очень тяжелый, что еле еле загружается даже при скорости 100мбит.
    Ответ написан
    13 комментариев
  • Как сделать точное вычисление физики гравитации на javascript в canvas методом Верле?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    elleremo, ускорение которое получают планеты пролетая вблизи других планет не является ошибкой!!!

    Этот эффект называется "гравитационный маневр для ускорения объекта" или же "гравитационная праща"

    Swingby_acc_anim.gifГравитационный манёвр для ускорения объекта (гравитационная праща)

    Не стал делать "точную имитацию" гравитации. Пошел по пути:
    1. каждый объект имеет массу равную объему объекта умноженному на плотность объекта
    2. каждый объект влияет на каждый динамический объект
    3. влияние пошагово рассчитывается по формуле (почти) :
    V = сумма(F); // суммарный вектор сил
    F = k*M/D; // сила влияния (расчитывается для каждого объекта оказывающего влияние на текущий)
    M - масса объекта
    D - квадрат расстояния между центрами масс объектов
    k - коэффициент для подгона скоростей (выполняет роль гравитационной постоянной)

    Алгоритм расчета (пошагово):
    1. Для каждого динамического объекта происходит расчет новых координат (сумма текущих координат и вектора скорости, рассчитанного на предыдущей итерации цикла симуляции)
    2. Каждый динамический объект сверяется с каждым объектом на предмет столкновения. Если расстояние между центрами 2х сравниваемых объектов меньше суммы их радиусов то происходит слияние. Если объединяются статичный и динамический объекты, то динамический удаляется а его масса добавляется к статическому с перерасчетом плотности, радиуса и объема. Если объединяются 2 динамических объекта то к первому добавляется масса второго с перерасчетом плотности, радиуса и объема, координаты и вектора скоростей пересчитываются как взвешеная сумма координат и векторов скоростей обоих объектов. После второй объект удаляется.
    3. Для каждого динамического объекта расчитывается сумма векторов силы влияния притяжения всех объектов. Затем данная сумма и вектор скорости текущего объекта суммируются
    4. Переход к новой итерации цикла симуляции.

    Вся реализация расчета тут (в конце скрипта). Все формулы вынесены в класс Calc.

    видеодемонстрация
    демонстрация (масштабируется колесиком мышки, перетаскивается с помощью ЛКМ)

    Добавил слияние планет при столкновении (массы суммируются, вектора скоростей суммируются, позиция переносится в центр масс)
    Добавил источники (автоматически генерируют планеты)
    Добавил отдельные кнопки для пуска и остановки источников

    5bbd21b57da99316097769.png
    Добавил настройки:
    • параметры отображения
      • отображать сетку - вкл/выкл отображение координатной сетки
      • отображать источники - вкл/выкл отображение объектов, генерирующих планеты
      • отображать шлейф - вкл/выкл отображение траектории планет

    • Настройки физических величин - позволяют задаь минимальные и максимальные значения для размеров и плотности статических и динамических объектов
    • Управление симуляцией
      • шаг симуляции - экспериментальная величина регулирующая точность расчетов
      • скорость источников - изменяет скорость, с которой источники генерируют планеты
      • включить источники - вкл/выкл генерацию планет источниками



    Доработал механизм расчета влияния гравитации, теперь у каждого объекта масса считается исходя из объема и плотности.
    Ввел изменение в процесс генерации новых планет, теперь они выставляются на лист с рассчитанной первой космической скоростью относительно центрального статичного объекта.
    Установил статичным объектам повышенную плотность, что существенно увеличило их массу (можно менять на панели настроек)
    Установил динамическим объектам пониженную плотность, что существенно уменьшило их массу и взаимовлияние (можно менять на панели настроек)

    5bbd22bc10be0483291405.png
    Ответ написан
    2 комментария
  • Где найти нормальный форум сделанный на nodejs?

    lastuniverse
    @lastuniverse
    Всегда вокруг да около IT тем
    Ответ написан
    Комментировать
  • Сверстать блок необычной формы?

    Aetae
    @Aetae
    Тлен
    Градиентами:
    Тень внутри сделайте тем же способом сами.)
    Ответ написан
    8 комментариев
  • Вопрос о реализации авторизации на React + Redux. Какие данные мы должны хранить в localStorage и в state redux?

    @Also_known_as
    Redux state используется для контроля состояния SPA приложения, хранить персональные данные в редакс стейт не является best practices, для этого используется session storage или реже local storage, хотя выбор в пользу последнего тоже имеет ограничения, токен лучше всего держать в сессионом хранилище оно лучше всего подходит, так как в SPA приложение на бекенде используется rest api или graph ql, токен должен регулярно передаваться в теле любого обращения к серверу и желательно на стороне фронтенда реализовать проверку времени его действия и его регулярное обновление.

    Что касается, "диспатчить из jwt" - каким это образом и что это вообще такое? Всё процессы связанные с генерацией токена происходят на бекенде на выходе только json и стринга в хранилище, это все что должно быть на фронте.

    Редьюсер - это метод обновление стейта приложения. Здесь мы можем выполнять асинхронный код, запросы к серверу а полученные данные необходимые для работы приложения кидать в стейт. В редьюсере обращаемся к серверу полученный токен и дату сохраняем в сессионом или локальном хранилище.
    Ответ написан
    2 комментария
  • Как сделать нагрузочное тестирование веб-сервера для сравнения PHP+Nginx vs Node.js?

    bingo347
    @bingo347 Куратор тега Node.js
    Crazy on performance...
    В плане отдачи статики - врядли Ваш код хоть на php хоть на node сможет тягаться по скорости с Nginx, иначе Вы не задавали бы подобные вопросы. В любом случае стоит ставить nginx перед любым бэкендом, хоть php хоть node. Помимо раздачи статики еще получите и нормальную работу с tls и балансировку.
    По динамике:
    php - работает только в режиме 1 запрос = 1 процесс, соответственно процессов в памяти будет больше, а значит и больше памяти потребуется и больше процессорного времени будет уходить на switch-context. Так же и очередь ожидающих запросов будет больше ибо php работает синхронно, а это значит что при ожидании io (файлы/бд) Ваш процесс в idle. Самый быстрый вариант сейчас с php-fpm, который работает по протоколу fastcgi и держит пул предзапущенных потоков php. Так же возможна работа по http с apache, но этот вариант явно медленнее и тяжелее чем php-fpm.
    node - может обрабатывать много запросов в 1 процессе засчет асинхронной модели выполнения, соответственно Вам может хватить небольшого количества процессов для очень большой нагрузки. Можно работать с nginx как по протоколу http (есть из коробки) так и fastcgi (при этом по прежнему имея 1 процесс)

    Теперь по нагрузочному тестированию, нужно хорошо разбираться в обоих тестируемых технологиях, знать о возможных оптимизациях и как их обойти. И даже при всем этом Вы не получите адекватных результатов на синтетических примерах... Можно сравнить решение конкретной задачи, но для этого придется разработать решение на обоих технологиях, а оно Вам надо? БольшАя часть задержек в большинстве веб-сервисов падает на базу данных, которая особо не зависит от выбранного ЯП, хотя асинхронная модель тут предпочтительнее...
    Так что пишите на чем умеете
    Ответ написан
    1 комментарий
  • В чем разница между css-loader vs style-loader?

    rockon404
    @rockon404
    Frontend Developer
    css-loader интерпритирует @import и url() в импортированном в проект css коде как import/require() и разрешает их.
    style-loader помещает css в DOM.
    Ответ написан
    1 комментарий
  • Есть ли смысл минифицировать js\css при включенном gzip + http2 на nginx?

    alexey-m-ukolov
    @alexey-m-ukolov Куратор тега Веб-разработка
    Я на эту тему делал доклад: https://youtu.be/rQDd5kCwDj8
    Кратко — есть.
    Ответ написан
    Комментировать
  • Как скачать миллион картинок?

    MvcBox
    @MvcBox
    Software Engineer [C/C++/JS(for Node.js)/etc]
    urls - массив ссылок на картинки.
    concurrency - во сколько потоков скачивать изображения. Можете поставить свое значение.
    Важно!!! Ни в коем слуае не используйе Sync функции при скачивании и сохранении картинок.

    'use strict';
    
    const Promise = require('bluebird');
    
    Promise.map(urls, async function (url, index) {
        try {
            // Здесь ваш код, который берет url и сохраняет изображение
            // Об async/await можно почитаь здесь - https://learn.javascript.ru/async-await 
        } catch (e) {
            console.error(e);
        }
    }, { concurrency: 10 }).catch(console.error);
    Ответ написан
    Комментировать