БЫСТРЫЙ FRONTEND. Оптимизация. Как писать JAVASCRIPT эффективно?

Поделиться
HTML-код
  • Опубликовано: 21 ноя 2024
  • НаукаНаука

Комментарии • 480

  • @gevorgmovsisyan5153
    @gevorgmovsisyan5153 3 года назад +179

    На русскоязычном ютубе нет таких как ты... Очень много уроков смотрел на разных каналах, но такого качественного контента как у тебя ни у кого не встречал

    • @UlbiTV
      @UlbiTV  2 года назад +13

      Спасибо друг:)

    • @rustam_gasymov
      @rustam_gasymov 2 года назад +1

      @@UlbiTV блин серьезно дружище, ты крут, я учусь и сейчас ищу себе ментора, если будет интересно маякни плз, может обсудим) спасибо тебе за контент

    • @miklayen_yakim
      @miklayen_yakim 2 года назад

      Да... Согласен

    • @railbatyrshin377
      @railbatyrshin377 Год назад

      Есть ещё Sorax. И автор данного канала они самые лучшие в русскоязычном Ютубе

    • @maxexc6939
      @maxexc6939 3 месяца назад

      Да, автор молодец! Спасибо 🙂

  • @BondStreetRed
    @BondStreetRed 3 года назад +45

    Я начинающий разработчик и меня давно беспокоила тема оптимизации. У вас всё классно описано, спасибо большое!)

  • @sergioglock2216
    @sergioglock2216 3 года назад +3

    Годнотой банчиш. Про изображения и шрифты не рассказал, никто теперь не узнает

  • @ВалентинРубин
    @ВалентинРубин 2 года назад +2

    Спасибо! Учусь по твоим видео параллельно ... спасибо!

  • @qutbiddinmakhmudov4088
    @qutbiddinmakhmudov4088 3 года назад +4

    Да профайлинг интересен!

  • @user_aw32xdg22
    @user_aw32xdg22 2 года назад +2

    максимум информации за минимум времени.... спс

  • @mikhailstepanishchev283
    @mikhailstepanishchev283 2 года назад +3

    Очень интересно,спасибо за видео!

  • @vadikot
    @vadikot Год назад +14

    Наконец добил этот плейлист. Поражает как элегантно ты смог все структурировать и преподнести, сначала мы учим базу, потом учимся складывать два числа, потом учимся умножать, ... , а потом учимся использовать все изученное ранее для решения сложных задач. Ты прекрасный учитель и помог огромному количеству людей, спасибо тебе!

    • @UlbiTV
      @UlbiTV  Год назад +1

      🤝🙏 спасибо!

    • @UlbiTV
      @UlbiTV  Год назад

      🤝🙏 спасибо!

  • @marynakosiv3750
    @marynakosiv3750 3 года назад +11

    даю знать: нам надо ролики про оптимизацию и дев тулзы! спасибо контент супер!!

  • @St3av3
    @St3av3 3 года назад +5

    Спасибо. Ещё раз укрепил в голове мысль о том, что ресурсы нужно экономить.

  • @user-pd9no5ye5g
    @user-pd9no5ye5g 3 года назад +4

    60к должно посмотреть точно) + залётные )

  • @wishmaker1443
    @wishmaker1443 2 года назад +4

    Наверное лучшее пояснение с примерами по useMemo и useCallback!

  • @artiomborisov6838
    @artiomborisov6838 3 года назад +4

    Спасибо 1 (для активности)

  • @orbismala8124
    @orbismala8124 3 года назад +4

    Большинство знал, но некоторая информация оказалась полезной. Спасибо.

  • @АлександрКорнетов-э3я

    Очень полезное видео, спасибо! Комментарий в поддержку канала)

  • @TheZionjke
    @TheZionjke 3 года назад +6

    спасибо тебе огромное! вроде бы про всё слышал и пробывал, но не понимал нахрен оно надо, а ты за пол часа все обьяснил) гений)

    • @UlbiTV
      @UlbiTV  3 года назад +3

      И тебе спасибо за поддержку!)

  • @artiomborisov6838
    @artiomborisov6838 3 года назад +4

    Спасибо 5 (для активности)

  • @andreiribac6284
    @andreiribac6284 3 года назад +10

    Огромное спасибо! Буду возвращаться к этому ролику по мере моего развития в профессии )

    • @UlbiTV
      @UlbiTV  3 года назад +2

      Успехов в развитии)

  • @Andrew_Code
    @Andrew_Code 2 года назад

    Я в первый раз слышу о многих представленных в этом ролике понятиях, но всё понятно. Спасибо!

  • @VolodymyrSirenko
    @VolodymyrSirenko 3 года назад +6

    Спасибо, я смотрю все ролики ! Хотя не до всего дорос по уровню. Спасибо!

  • @ПопівчакБогдан
    @ПопівчакБогдан 2 года назад +2

    Большое спасибо за качественньій материал!

  • @efimkapliy6370
    @efimkapliy6370 9 месяцев назад +1

    Более 2-х лет прошло с момента записи видео, а оно ещё актуально! Спасибо за качественный материал!

  • @artiomborisov6838
    @artiomborisov6838 3 года назад +4

    Спасибо 2 (для активности)

  • @vadymkononenko685
    @vadymkononenko685 3 года назад +5

    Лучший канал в русскоязычном сегменте!! сделай видео: маленький пет проект с новыми хуками + распрастраненными кастомными и тсом или про микрофронтенды

  • @mikhailblush5261
    @mikhailblush5261 3 года назад +4

    Спассибо. Интересно посмотреть видео про профайлинг

  • @artiomborisov6838
    @artiomborisov6838 3 года назад +4

    Спасибо 3 (для активности)

  • @alexsuhobski5231
    @alexsuhobski5231 3 года назад +4

    Досмотрел до конца. Пишу комментарий поддержки). Написать себе конспект по видео и правда будет не лишним, очень много информации.

  • @jsmonstr9638
    @jsmonstr9638 3 года назад +4

    Очень крутой ролик по оптимизации javascript react

  • @villishelpy5055
    @villishelpy5055 2 года назад +2

    Прекрасный ролик помогаю продвижению

  • @pipkin931
    @pipkin931 2 года назад +3

    На одном дыхании…
    Не вылетает тема с webpack. В частности заинтересовала тема
    - с подгрузкой, лениво, npm модулей
    - разделение кода для десктопа и мобильных
    Очень надеюсь, что будет время записать более подробное видео

  • @irohVlad
    @irohVlad Год назад +1

    Самый полезный ролик за последние месяцы. Ни одного из подходов не видел пока искал про оптимизацию, а тут столько всего полезного. Надо было раньше наткнуться. Больше спасибо.

  • @AirdropLuck
    @AirdropLuck 3 года назад +28

    На 24:30 оговорка про функциональные и классовые компоненты. Пишу в тетрадь сразу, поэтому заметил :) Спасибо за афигенный контент!

    • @UlbiTV
      @UlbiTV  3 года назад +5

      за конспект отдельный респект! И за внимательность тоже))

  • @vinderornitier
    @vinderornitier 3 года назад +32

    Тимур очень важно именно от вас видео по дэбагу! Как понимать ошибки которые вываливаются в консоль, к чему они относятся и как ничего не перепутать.
    Это как раз то, что очень поможет новичкам в будущем не наступать на одни и те же грабли.

    • @johndoe034
      @johndoe034 2 года назад +4

      100% было бы полезно, особенно в дев тулзах хрома. Тема актуальна не только для новичков, на проекте и мидлы и синьоры дебажили только консоль.логами

  • @londonsky1835
    @londonsky1835 3 года назад +6

    Плюс за разбор профайлинга

  • @leokorsunsky2395
    @leokorsunsky2395 2 года назад +3

    Спасибо за такой контент!

  • @andreyphilippov
    @andreyphilippov 2 года назад +3

    Даёшь профайлинг!!!!

  • @VictoriaSH100
    @VictoriaSH100 2 года назад +2

    Интересно полный разбор профайлинга

  • @helenit4365
    @helenit4365 3 года назад +7

    Большое спасибо, лайк и продвижения каналу!

  • @glebpilipenka3060
    @glebpilipenka3060 3 года назад +4

    Топовый, больше видео по вкладкам perfomance & profiler, лучший!

  • @maximlazarsky7135
    @maximlazarsky7135 2 года назад +3

    Спасибо тебе. Все видео отличные, нет воды, всё по делу

  • @VolodymyrSirenko
    @VolodymyrSirenko 3 года назад +7

    Ролик про профайлинг тоже нужен!

  • @moi-nick-zanyat
    @moi-nick-zanyat 3 года назад +192

    Сделай видео с примером о структурности сложного многостраничного сайта!))

    • @lopsonbalzhinimaev642
      @lopsonbalzhinimaev642 3 года назад +15

      feature slice архитектура

    • @moi-nick-zanyat
      @moi-nick-zanyat 3 года назад +8

      @@lopsonbalzhinimaev642 хотелось бы увидеть на примере с комментариями

    • @lopsonbalzhinimaev642
      @lopsonbalzhinimaev642 3 года назад +4

      @@moi-nick-zanyat у этой архитектуры неплохая документация, почитай, там есть примеры

    • @белка-у8б
      @белка-у8б 3 года назад +3

      MPA?

    • @СергейВер-и9ю
      @СергейВер-и9ю 2 года назад +1

      @@lopsonbalzhinimaev642 ох не знаю, 2 недельки поучил, поюзал, что-то вообще не зашло. Слишком сложная структура, которая отнимает кучу времени + ещё сыроватая.
      А главный минус, мало кто её использует.
      Лучше её не учить. Если в конторе на этом все пишут, то и новичка научат)

  • @romansamon9215
    @romansamon9215 2 года назад +6

    Привет! Из обычного верстальщика по-тихому внедряюсь во фронтенд тусовку, твой канал - находка, насчет профайлинга: часто использую, но видос все равно хотелось бы!
    Спасибо за старания

    • @UlbiTV
      @UlbiTV  2 года назад +3

      Успехов!

  • @Vinits-i
    @Vinits-i 2 месяца назад

    Это просто шикардос!! Наконец-то я разобралась, как чинить перерисовки, помимо прочего

  • @yourbadapple
    @yourbadapple 2 года назад +2

    Узнал много терминов, практики, спасибо большое

  • @nelson6783
    @nelson6783 3 года назад +7

    очень инетресно про профайлинг, ждем ждем ждем)

  • @konstantinnaumov6281
    @konstantinnaumov6281 3 года назад +24

    Каждому видосу лайк нужно ставить автоматом. Никакой воды, только по делу. Спасибо за годный контент.

  • @АннаПотреба-я2щ
    @АннаПотреба-я2щ 3 года назад +6

    Жду выпуск про девтулз для отслеживания загрузки и прочего)

  • @xela_8746
    @xela_8746 3 года назад +5

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

  • @Overlord_182
    @Overlord_182 2 года назад +2

    На восьмой минуте говорится про denounce, заместо хука можно использовать import _ from "lodash" и _.debounce

  • @bulbaway
    @bulbaway 2 года назад +2

    Просто топовый контент! Про webpack хотелось бы поподробнее изучить:)

  • @aya4924
    @aya4924 3 года назад +7

    Словил себя на мысли, что уже несколько месяцев на тему разработки смотрю только Ulbi TV )
    Что касается этого ролика - просто ОБЯЗАТЕЛЬНО к просмотру всем начинающим кодерам, да и продолжающим не помешает.
    У меня всегда подгорает, когда коллеги тащат в элементарный лендос кучу лишних библиотек, ленясь вместо этого написать 30-50 строк чистого js. А вы задумывались, сколько такого треш-кода движется в мировом интернете? Сколько тупого ненужного трафика? А это же всё, в конечном счёте, энергозатраты. Поэтому автору огромный респект за то, что затронул эту важную тему. Я считаю, что это нужно изучать сразу, перед html и css )

    • @UlbiTV
      @UlbiTV  2 года назад +3

      Спасибо за такое доверие и поддержку! Ценю!

  • @uNkind33
    @uNkind33 3 года назад +8

    Батя как всегда сначала люкс, потом просмотр!

    • @UlbiTV
      @UlbiTV  3 года назад +2

      Олды на месте))

  • @hutoryanin
    @hutoryanin 3 года назад +4

    Здравствуй Тимур, благодарю за новое видео. Интересно.
    *Л. а. й. к. о. с.* за видос

  • @platonyasev1913
    @platonyasev1913 3 года назад +45

    Крутое видео! Про профайлинг было бы очень неплохо)

    • @СергейБрыков-х8и
      @СергейБрыков-х8и 3 года назад

      Профайлинг гоу! Могу дать реальный проэкт чтоб ты посмотрел по профайлеру

  • @n1azar
    @n1azar 2 года назад +4

    Спасибо. Настло время писать тесты ))) будет ли такое видео?

  • @chillchill5254
    @chillchill5254 3 года назад +5

    По названию - очень интригующе. Ждем 1080рублей

  • @MAKS-FISHER
    @MAKS-FISHER 11 месяцев назад

    Ещё раз убеждаюсь, что твой контент просто лучший !!! Обязательно буду разрабатывать приложения сразу с твоими рекомендациями !!!!!!!

  • @michigan996
    @michigan996 3 года назад +6

    Прекрасный ролик, я сам задумывался над этим вопросом. Некоторые примеры я уже знал и использовал, а некоторые было интересно узнать тут. Все доступно, наглядно и в одном месте. Спасибо!

  • @gtsjdm
    @gtsjdm 3 года назад +6

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

    • @nikolaiUlianov
      @nikolaiUlianov 2 года назад

      Если бы только для начинающих)

  • @filippkotenko851
    @filippkotenko851 3 года назад +5

    Спасибо тебе, на 24:33 ты сказал для функциональных 2 раза)

    • @UlbiTV
      @UlbiTV  3 года назад +3

      при монтаже бывают косяки :)

  • @ruslanshmadchenko2132
    @ruslanshmadchenko2132 3 года назад +4

    спасибо большое за качественный контент, очень рад новому выпуску))

  • @apexnuts9785
    @apexnuts9785 3 года назад +6

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

  • @darieandre5598
    @darieandre5598 3 года назад +6

    Комментарий в качестве поддержки

  • @tehbangel
    @tehbangel 3 года назад +5

    Отлично, все толково и без воды.

  • @АлександрКулик-м7я
    @АлександрКулик-м7я 3 года назад +6

    Что сказать... Красавчеггг... Спасибо большое.

  • @ВладиславАлексеев-г7с
    @ВладиславАлексеев-г7с 3 года назад +152

    Очень круто, спасибо! Было бы круто еще увидеть курс по безопасности. Многим было бы полезно т.к очень важная тема
    (XSS, CSRF, ...)

    • @TheBorninmotion
      @TheBorninmotion 3 года назад +5

      поддерживаю !

    • @UlbiTV
      @UlbiTV  3 года назад +36

      Спасибо за идею, есть что рассказать на эту тему) Главное время найти

    • @Fs-xj2gu
      @Fs-xj2gu 2 года назад +1

      @@UlbiTV можешь еще рассказать про себя, про свой опыт итд, можешь скинуть свой инстаграм

    • @kvadro_id
      @kvadro_id 2 года назад

      @@UlbiTV да-да! Расскажи кем и как работаешь. Как шёл к этому, какие ошибки совершил и что изменил бы...

    • @Fs-xj2gu
      @Fs-xj2gu 2 года назад +6

      @@UlbiTV Сделай видео с ТОП ошибок как делают многие, но так делать нельзя, например неправильно используют useMemo или useCallback или кто то делает неправильные сборки, или для каких проектов что лучше подойдет по стеку где лучше использовать redux & thunk & mobx & redux saga & server side rendering & spa & в каких сервисах сайтах лучше использовать те или иные технологии итд Частые ошибки при создании компонентов, как правильно создавать компоненты. Топ архитектур, где когда использовать, feature sliced, атоморный дизайн, тупые умные компоненты, к примеру много раз встречал что неправильно использоовали архитектуру тупых и умных компонентов итд

  • @mrstronciy1060
    @mrstronciy1060 3 года назад +5

    Всё по полочкам. Жирный лайк!

  • @WalterWhite-ck5rz
    @WalterWhite-ck5rz 3 года назад +4

    Огонь просто 👍
    Много полезного, что реально пригодится в работе.

  • @ekaterinakryuchkova2690
    @ekaterinakryuchkova2690 Год назад

    спасибо! очень люблю смотреть твои ролики, всё кратко и нужно, без лишней воды

  • @каквытам
    @каквытам Год назад

    Не перестаю находить жемчужины на твоём канале. Спасибо большое за лучший контент по фронтенду на русскоязычном Ютубе!

  • @ИванШевченко-й5р
    @ИванШевченко-й5р 3 года назад +5

    У тебя все ролики ценные! Спасибо за шикарный контент!

  • @SlavaTechnology
    @SlavaTechnology 3 года назад +5

    Никогда не профайлил фронтенд, будет полезно посмотреть

  • @Г.Ка
    @Г.Ка 2 года назад +2

    Спасибо за качественный контент и доступную подачу

  • @anton-vr5xw
    @anton-vr5xw 3 года назад +4

    уже 60к, поздравляююю 👏👏👏

    • @UlbiTV
      @UlbiTV  2 года назад +2

      Спасибо!! 🙏

  • @sergeynazarov2473
    @sergeynazarov2473 2 года назад +2

    Дебаунс и троттлинг, они же задержки перед экшеном, которые нарушают юзабилити, запросто заменяются другой техникой, на примере живого поиска:
    - Ставишь выполнение экшена с 2, а лучше 3 символа, что бы не грузить лишнего
    - Результат записываешь в массив
    - Все последующие запросы читаешь из записанного массива
    - Очищаешь массив, когда количество символов < установленного
    - Делаешь доп проверки на вставку в поле и прочие
    Теоретически, такая техника неэффективна, если прилетает пару миллионов результатов, но если это происходит, что-то не так с бэкомъ...

  • @perseveranse
    @perseveranse 3 года назад +8

    Спасибо, что делишься такой ценной информацией. Сижу, жду ролик в 1080 xd

    • @UlbiTV
      @UlbiTV  3 года назад +2

      Жду фидбек после просмотра в 1080)

    • @perseveranse
      @perseveranse 3 года назад +1

      Лайк, подписка, колокольчик :D. А если серьезно - хорошо укомпонованный видос, все по порядку, темы интересные и главное - даешь краткую информацию, которую, при желании, можно догуглить. Я, отчасти благодаря тебе, на работу попал, и даже что-то знаю, с ростом знаний видосы твои стало смотреть интереснее.

  • @woodDacha
    @woodDacha 3 года назад +5

    Как всегда сразу лайк. Посмотрю вечером))

  • @Yevgen_sky1608
    @Yevgen_sky1608 2 года назад

    Спасибо, очень доходчиво, про профайлинг хотелось бы ролик Ваш посмотреть, интересная тема!

  • @МаринаБовкунович-л1щ
    @МаринаБовкунович-л1щ 2 года назад +2

    Спасибо большое за такой крутой канал!

  • @mrsuhrob1334
    @mrsuhrob1334 2 года назад +3

    Спасибо огромное Тимур желаю Вам удачи! Жду уроки grafql Apollo ))

  • @MDanshin
    @MDanshin 3 года назад +9

    Полный разбор профайлинга очень интересно.

  • @tatyanaruskevich3290
    @tatyanaruskevich3290 3 года назад +6

    Спасибо за ваш труд

  • @sergeysamius1128
    @sergeysamius1128 3 года назад +5

    Спасибо! будем изучать

    • @sergeysamius1128
      @sergeysamius1128 3 года назад +1

      А вообще не стоит ролик начинать с унылого: "Мало кто посмотрит", "мало кому нужно". Нужно - "Оптимизация - важная вещь!!!!111" (на определённом этапе разработки проекта)

    • @UlbiTV
      @UlbiTV  3 года назад +2

      Успехов в изучении!

  • @TimurSrvarov
    @TimurSrvarov 2 года назад +2

    Очень надо видео о Perfomance

  • @alextuzov904
    @alextuzov904 3 года назад +5

    Спасибо! Очень познавательно и интересно!

  • @anazkomult
    @anazkomult 3 года назад +6

    Спасибо, Тимур! Отлично, как всегда.

  • @ЕвгенийЖ-н6м
    @ЕвгенийЖ-н6м 2 года назад +3

    Молодец, полезный контент.

  • @otabekfayziev7076
    @otabekfayziev7076 3 года назад +5

    Го про profiling)

  • @Сергей-г8г6с
    @Сергей-г8г6с 3 года назад +4

    Спасибо! Познавательно!

  • @tetrada9642
    @tetrada9642 3 года назад +5

    Отличное видео! Все понятно и очень полезно. Спасибо!

  • @palesskirabinzon4795
    @palesskirabinzon4795 2 года назад +3

    респект, огромная работа проделана, особенно полезно ньюбикам вроде меня 🤩спасибо🤝

  • @РоманБыков-э6м
    @РоманБыков-э6м 2 года назад

    Затронуты серьёзные темы. Спасибо!

  • @frednoby8531
    @frednoby8531 3 месяца назад

    Просто шикарно! Спасибо тебе за труд, Тимур.

  • @AlexandruBejenari
    @AlexandruBejenari 3 года назад +4

    Thx. You are the best.

  • @seoonlyRU
    @seoonlyRU 2 года назад +1

    спасибо, будем эффективными! лайк от СЕООНЛИ

  • @Markeldo
    @Markeldo 2 года назад

    Спасибо за полезную инфу. На работе используем большинство подходов, но смысл в них стал ясен после видео

  • @vintprox
    @vintprox 3 года назад +10

    Полезно! Посоветую новичкам.
    Если библиотека из npm сделана под tree shaking, то размер бандла будет зависеть от количества по настоящему используемых функций, потому что импорт избирательный. Но, конечно, не всё, что мы хотим, будет под tree shaking.

    • @UlbiTV
      @UlbiTV  3 года назад +3

      Угу, все верно)

    • @andreipalii1220
      @andreipalii1220 Год назад

      А как узнать если библиотека сделана под Tree Shaking? Неужели лезть в исходники? Или в том числе этим разрабы либы её продвигают? Благодарю ;)

  • @Санскритдляпреданных

    Как всегда лайк не глядя! Спасибо за годный контент!

  • @adelinaromanova8353
    @adelinaromanova8353 3 года назад +7

    Тимур, спасибо и лайк!💥

    • @UlbiTV
      @UlbiTV  3 года назад +1

      Спасибо!