Для обработки роутов используется сторонняя библиотека route-parser. Единственная в проекте. Я об этом упоминал. Обратите внимание на импорты. Роуты в проекте это не просто строки, а экземпляры класса Route и именно у них вызывается match. Когда Вы вызываете '/posts/query/:query'.match('/posts/query/test') то сравниваете строку '/posts/query/:query' и строку '/posts/query/test'. Эти две строки абсолютно точно не матчатся.

@@EasyITChannel Понял, спасибо)

Спасибо, что нашли время на комментарий. 1. Синхронно? т.е. о Promise.race Вы не слышали? И тело промиса может заблокировать рендер UI? Интересненько. Или у Вас какая-то особенная интерпретация понятия "синхронно"? 2. Так точно, об этом я и говорю, только другими словами, для простого понимания и запоминания. 3. Т.е. Вы на полном серьезе думаете что Promise.resolv() возвращает какой-то особенный промис, а не точно такой же точно как любой другой, но зарезолвленный в рамках текущего макротаска? С точки зрения обработки промиса выходит есть мега-разница есть тело у промиса или нет тела? Совет - не нужно плодить сущности там, где все намного проще.

Это потому, что многое в vite реализовано автоматически "out of the box", а в том же webpack любую мелочь надо делать ручками. Дев сервер vite автоматически перенаправляет все запросы index.js. В webpack поддержку для history api надо настраивать отдельно в конфиге, что-то типа: devServer: { historyApiFallback: true, // вот это open: true, hot: true, port: 3000, static: { directory: path.join(__dirname, 'public'), // Директория для статических файлов }, }

@@EasyITChannel Спасибо большое! Разобрался с Webpack.... и с Parcel тоже. Все супер!

При использовании "нового" React Router решается это немного по-другому. В планах есть доснять последний ролик в этом цикле с объяснением как раз этого момента. Если кратко - нужно использовать функцию defer из react-router для возврата данных и компонент Await внутри Suspense. Примечание: это не работает с SSR.

@@EasyITChannel Понял спасибо, но эта реализация подходит для функции "lazy()" (из реакта), а не для ".lazy" (из роутера). А можно ли как -то сделать фалбэк (прелоудер) с использованием проперт ".lazy()" из роутера?

Конечно, я как раз об этом написал выше. Нужно использовать defer при возврате данных в роуте. А в компоненте нужно использовать Await внутри Suspense.

@@EasyITChannel 1) В актуальной версии роутера (7+) функции "defer()" нет (её удалили), вместо неё используются обычные промисы. Честно говоря я даже не понял зачем она нужна была. 2) Т.е. реализовать эфект прелодера (fallback) при использовании проперти ".lazy()" марушрутера для загрузки компонента-страницы точно-такая же как без ".lazy" (Через <Await /> и "import()" или через "React.lazy()" и "import()"). В связи с этим вопрос: 3) Получается проперти ".lazy()" маршрутера нужно использовать только тогда, когда мы хотим лениво подгрузить значения для каких-то других проперти маршрутера кроме ".element", т.к. для ленивой подгрузки только ".element" он бесполезен? (т.к. мы всё равно вынуждены использовать <Await /> и "import()" или через "React.lazy()" и "import()")

@@johngalt9494 Скоро будет видео, в нем всё подробно расскажу.

WASM сам по себе не работает, только через JS. У него нет доступа к браузеру напрямую, нет доступа к DOM. В JS, то что Вы пишете, реализуется по-другому, и в 99% случаев виноват сам юзер. Классика - переход по непонятной ссылке с одновременно залогиненным пользователем в другой вкладке браузера. Как всегда уровень безопасности обратно пропорционален уровню удобства. Сделайте работу 100% безопасной и только 1% юзеров будет способен работать в таком окружении. Не будет редиректов, автологинов, сохранения паролей, и т.д.

@@EasyITChannel теперь понял, благодарю за такой ответ!!

Ну есть такая проблема, решаемая даже ручками с помощью TextEncoder. Но уже в этом примере мы используем wasm-bindgen, а этот модуль решает вопрос автоматически.

@@EasyITChannel я не про совместимость, а производительность

Ну так и видео об этом. Если издержки при передаче данных в wasm большие, то использовать его не надо. Речь ведь не идет о том, что обязательно нужно везде использовать wasm. Если выигрыш от обработки внутри wasm превышает издержки - можно использовать. Хотя, нужно упомянуть и о том, что бывает и так,что нет выбора и плевать на издержки. Есть, например, закрытая библиотека и прикрутить ее по-другому невозможно.

@@andrewkuzmin4400 спасибо за внимательный просмотр :) Такое бывает.

@@nikitashamberger9639 Спасибо за поддержку.

Работа под виртуалкой всяко хуже полноценной системы. Оправдано только если проект простенький и денег на рабочую машинку нет/жалко, приходится все на одной системе делать. Ну ещё вариант не получается с винды спрыгнуть хотя-бы не время работы. Сам на wsl никогда не работал - я с 2000 года виндой не пользуюсь совсем, но коллеги кто с wsl перешли на Mac чуть ли не до потолка прыгали от счастья.

@@EasyITChannelвообще не важно какой проект. Сейчас никакой разницы нет под чем работать, возможно что наоборот виндовс наиболее удобный вариант так как совмещает в себе плюсы двух систем за счет wsl

@@12345_qwerty проблема с wsl начинается тогда, когда начинаешь работать с железками (гпу для игр), юзб и тд. Сейчас ситуация гораздо лучше, чем было раньше и обходные пути присутствуют. С другой стороны ни один десктоп на линуксе не работает также быстро и плавно как на винде. Уже много лет мечусь с дуалбута до всл и hyperv - с wsl на данный момент самый лучший опыт

Попробуй мак ;)

@@12345_qwerty это очень субъективно. Виндоуз удобна тем, кто к ней привык, только и всего. Я еще до знакомства с windows версии 3.0 работал с несколькими ОС, поэтому уже тогда воспринимал эту ОС как одну из многих, чем-то лучше, чем-то хуже. Ну и мне, после 22 лет на линуксе (только на нем, и на работе и дома) и 3 лет на маке - виндоуз предельно не удобна. Просто жесть как неудобна, реально. Мне удобнее busybox, если понимаете о чем я. Вот при переходе с линукса на мак, кстати, вообще неудобства не ощутил, скорее наоборот. По поводу - не важно какие проекты - улыбнуло. Как и странная уверенность в том, что виртуалка внутри другой системы может конкурировать с нативной системой на том же железе.

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

Если посмотреть в описание под видео, то там есть ссылка на исходный код. Причем, это актуально для любого видео на канале.

а что не так, разрешите поинтересоваться?

@EasyITChannel есть спецификация html5 и вней раздел про ивент луп - попробуйте почитать

:) возможно Вы не поняли о чем этот ролик? Кроме "почитать" еще есть "понять прочитанное". В ролике речь идет о практическом понимании, о том как это работает на практике. Как это реализовано в "металле" ;) Будете с этим спорить? Что-то из изложенного, на самом деле не так и Вы можете это доказать практическим примером?

Спасибо за просмотр и обратную связь. Исходный код есть у почти всех видео на канале. Чтобы все буковки были видны четко и не расплывались рекомендую смотреть в 1080p, это значительно упростит разбор кода. У фоновой музыки есть важная причина. Вряд ли Вам будет комфортно слушать как в фоне воет воздушная тревога, проезжает трамвай, лают собаки, работает пылесос у соседей, скрипит кресло и т.д. А переозвучивать по 100 раз или часами чистить звук у меня, к сожалению, нет времени - работать надо. Поэтому простой Noise Gate и нейтральная фоновая музычка решают проблему.

@@EasyITChannel Приношу Вам свои извинения. Я сначала скачал весь плей лист, а потом смотрел в низком разрешении. К музыке постепенно привык. После просмотра ролика окончательно отказался от React и подписался на Ваш канал. Огромное Вам спасибо! Жаль, что «прикоснулся к прекрасному» с некоторым опозданием…

Спасибо за поддержку.

Тут зависит от того, что считать костылями. Есть "стандартный подход" работы с компонентами в реакт. "Данные в компонент через пропсы, из компонента - через колбэки". Это отлично работает в большинстве случаев. Но в сложных, и особенно в высоконагруженных приложениях такая схема работает не очень (запредельная сложность, лишние ре-рендеры, куча зависимстей), поэтому есть встроенные механизмы, упрощающие работу в сложных случаях. Это уже продвинутый уровень и он как-бы нарушает кажущуюся простоту и логичность ;) Но так в любом фреймворке. В документации всегда демонстрируют примитивный пример и говорят - во как у нас всё легко и просто. Потом с ростом приложения часто упираются в тупик и начинают городить костыли. Причем, тупик этот появляется тем быстрее, чем меньше опыта работы с фреймворком, чем хуже понимаешь его сильные и слабые стороны.

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

А зачем их искать в бандле? Бандл загружен, шрифты подключены, загружены, им назначено имя. Нужно просто указывать шрифт в стилях в font-family по имени и всё.

@EasyITChannel Я подключил шрифты, у них путь допустим: ../../src/fonts/Arial.ttf В бандле потом они теряют свои пути, ну либо я что-то не так делаю

Вы правы, почти все видео делаю исходя из опыта в продакшн. Правда иногда это понятно только тем, кто тоже имеет подобный опыт ;)

Спасибо за просмотр.

Добрый день, очень сложно сказать что-то по поводу этого вопроса. В Git находится одна папка с одним набором файлов. В этом легко убедиться если зайти через веб-браузер по ссылке. Мне, если честно еще не доводилось увидеть двух одинаковых папок рядом, по моему скромному опыту операционные системы не допускают такого.

@EasyITChannel я имею ввиду папки проекта в вашем видео, но и в моем vs code тоже самое.

ах это :) Это среда разработки так отображает. Это одни и те же файлы, example1/EasyRunTracker это гит репозиторий, а та что в корне это проект Манки скрипта. Вот так отображается. Если открыть проект прямо из папки проекта, а не из корня репозитория то будет одна папка. Но это ерунда, не берите в голову.

И Вам спасибо за просмотр.

Спасибо за просмотр.

Спасибо на добром слове.

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

Так бывает. Особенно когда и изначально четкого понимания не было, а были догадки навеянные знанием как это устроено в других языках. Более новое видео посмотрели?

Скорее всего связано с тем, что момента выпуска видео прошло уже порядочно времени и версии программ поменялись. Как дойдут руки - поправлю.

@Graymar112 Обновил репозиторий. Просто обновил пакеты до последних и установил type в package.json - для новой версии vite это обязательно. Должно работать.

Работы навалилось много. Нет времени на хобби ;)

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

на канале

В тот момент когда я об этом говорю в правом верхнем углу появляется ссылка на видео. вот такая kzbin.info/www/bejne/mYfdqHilrLGYZpo

Добавил.

Так а нет его. По крайней мере пока.

И Вам спасибо за просмотр. И поддержку.

Хорошо. Спасибо за просмотр.

И то верно ;)

@@EasyITChannel 😂

Спасибо за фидбэк:)