Рубрика «javascript» - 432

Всем привет! Встретил статью о том, как на сайте meteor.com обеспечена работа для высоких нагрузок. Звучит это довольно интересно. (пер.)

Во-первых, зайдите на meteor.com и посмотрите, как это работает.

Мы все знаем, что meteor.com сделан на Meteor. Вы можете заметить, что загружается он очень быстро. Также, у него нет процесса загрузки — после того, как HTML построен, страница сразу отображается на экране.

Но как это возможно? Обычно, это занимает какое-то время — подключение к серверу, получение данных и отображение информации на экране. Может, Meteor использует какую-то магию с Galaxy?
Читать полностью »

Постараюсь быть неимоверно кратким.

Написано для тех, кто только начинает!

Статей про наследование в JS не счесть:

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

У меня в google по запросу "what is the difference between inheritance and legacy" первая ссылка ведёт сюда: ссылка.

Само собой, что статей там не одна.

Там есть такая строчка, дописка: Also, as pointed out in some comments, «inheritance» is generally from the viewpoint of the receiver, while «legacy» is from the viewpoint of the giver: My inheritance was my father's legacy.

Краткая суть, которая не отражает всей глубины, которую я себе уяснил, в том, что:

  • legacy — это взгляд со стороны родителя, широкий
  • inheritance — это взгляд со стороны потомка, узкий

Поэтому я считаю, что в обычных ООП языках программирования типа Java, C#, С++ и т.п. используется термин inheritance — наследование.

А у нас в JavaScript используется почти то же самое, но немного шире: legacy — наследство.

А т.к. в Русском Языке разницы между этими понятиями почти нет, то отсюда и масса FuckUp'ов с пониманием зачем это нужно.

И, в том числе потому, что от Legacy code мы никуда не денемся.

UPD: В комментариях подсказывают, что речь идёт о Гипотезr Сепира-Уорфа, спасибо.
Читать полностью »

Сегодня получил вот такое интересное письмо:image
Наконец-то что-то новенькое и интересное появилось. Цена, по-моему конечно немного завышенная относительно его характеристик(222,31 €), но такому аппарату я считаю место быть на рынке.
Читать полностью »

История

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

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

И наконец, в один прекрасный день вы решили: “Сделаем это!”. И вот вы уже пытаетесь разобраться как реализовать бизнес-логику своего приложения, ту киллер-фичу, которая будет двигать продукт вперед. У вас есть идея как это сделать, и вы знаете, что способны на это. И вот вы говорите: “Готово! Работает!” У вас есть успешный прототип! Осталось только упаковать его в веб приложение.

“Окей, сделаем сайт,” говорите вы.

А только потом вы понимаете, что для этого нужно выбрать язык программирования; нужно выбрать (современную) платформу; нужно выбрать какие-то (современные) фреймворки; нужно настроить (и купить) хранилище, базы данных и хостинг; нужно обеспечить интерфейс для администрирования; нужно обеспечить контроль доступа и систему управления контентом.

Перед вами десятки и десятки архитектурных решений, которые необходимо принять. И вы не хотите ошибиться: требуются технологии, которые позволят вести быструю разработку, поддерживают постоянные итерации, максимальную эффективность, скорость, устойчивость и многое другое. Вы хотите быть бережливым (lean) и гибким (agile). Вы хотите использовать технологии, которые помогут вам быть успешным как в краткосрочной, так и в долгосрочной перспективе. А выбрать их далеко не всегда так просто.

“Я перегружен”, говорите вы и чувствуете себя перегруженным. Энергия уже не та, что была в начале. Вы пытаетесь собраться с мыслями, но работы слишком много. Прототип медленно блекнет и умирает.
Читать полностью »

Всем привет! Этот небольшой пост посвящен системе тестирования MeteorJS-приложений Laika от Arunoda Susiripala. Ее особенности довольно интересны:

  • Laika запускает свои тесты так же, как запускается реальное приложение (используется PhantomJS)
  • Каждый тест изолирован, т.е. заново запускается ваше MeteorJS-приложение с чистой базой данных
  • Вы можете использовать для разработки и meteor, и meteorite, laika прекрасно работает с ними обоими
  • Вы можете запускать проверку на сервере и клиенте в одном тесте. Это поможет протестировать такие моменты, как права доступа (permission), подписки (subscriptions) и вызовы методов (method calls)
  • Так как MeteorJS работает в реальном времени, то вам потребуется тестировать приложение при работе нескольких клиентов одновременно. Laika это может.
  • Возможность использования событий для более точного тестирования, т.е., фактически, эмуляция работы пользователя
  • Передача значений в код во время выполнения теста через аргументы
  • Ожидание окончания генерации шаблонов (templates)

Читать полностью »

Сегодня мы запустили новую версию веб-интерфейса сервиса Яндекс.Метро. Теперь в новом «островном» дизайне доступны схемы метрополитена пяти городов. Но мы обновили не только визуальную часть, но и перенесли всю логику с серверной стороны на клиентскую.

image

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

Сервис Яндекс.Метро был запущен в далеком 2007 году. С тех пор веб-интерфейс практически не развивался, дизайн выглядел откровенно устаревшим. Почтенный возраст сервиса сказывался и на технической стороне. Все схемы представляли собой наборы изображений в формате GIF, на которых при помощи координат размещались объекты. Из-за этого возникали трудности с обновлением графа, нельзя было самостоятельно вносить изменения в схему (приходилось привлекать аутсорсеров, заказывать у них картинки). Так как названия станций также были вшиты в картинки, локализация схем потребовала бы генерации полных наборов GIF-изображений.
Читать полностью »

В последнее время все больше и больше игр делается под браузеры. Помимо разработки новых новых игр наблюдается тенденция «клонирования» старых игр. В качестве примера можно привести такие игры как Battle City, DX-BALL.
Смотря на разработки третьих лиц, у меня все больше и больше возникало желание сделать что-то подобное, написать свою браузерную игрушку. Но каждый раз начиная что-то делать я вставал в тупик, т.к. отсутствие фантазии и дизайнеских навыков давали о себе знать. Не так давно я увидел пост о том, как ребята из студии BorodinART сделали клон одной из любимых игр детства — DX-BALL. Этот пост вдохновил меня и я решил сделать клон стандартной игрушки из KDE — KBounce или «Неугомонные шарики».
Читать полностью »

Ни для кого, думаю, не секрет, что touch-устройства обрабатывают «мышиные» события несколько иначе, не так, как это происходит на десктоп-браузерах…

Самый яркий для меня пример, это обработка псевдокласса :hover. Для начала iOS7, например, не будет реагировать на hover если только на элемент, или его родителя, не навешена обработка события click. Это хорошо видно вот на этом примере: jsfiddle.net/H8EmG/ — сколько не тыкай пальцем в текст — никаких подчеркиваний не увидишь. А в этом примере jsfiddle.net/H8EmG/1/ «тычок» пальцем в текст будет приводить к его подчеркиванию. Интересный факт — пока не ткнем в другой элемент, текст так и будет сидеть под ховером…

Другой интересный пример, это обработка появления элементов «по-наведению»: jsfiddle.net/ASRm9/1/ Попробуйте нажать на текст. Сперва вы увидите текст «HOVER!», появившийся внутри строки, а вот второе нажатие уже вызовет alert('click'). Это происходит потому, что iOS понимает что за :hover что-то скрыто, и старается не сломать поведение, заложенное автором сайта.

Но однажды мы столкнулись с такой багой, объяснить которую мы не смогли до сих пор, а на ее локализацию потребовался не один отладки на iPad… Желающие подробностей, а также хитрого, как мне кажется, способа решения, наверное, всех проблем с :hover разом — прошу под кат…

Читать полностью »

Иногда создаваемый компонент связан с большим количеством статических данных. Единственный «нормальный» способ хранить эти данные в javascript — это строки. Но хранить в строках многострочные данные неудобно, т.к. каждая строка требует дополнительного форматирования. Кроме того приходится следить за экранированием символов.
Читать полностью »

Всем привет! Хочу показать свой кусочек CoffeeScript для декларативной подписки и обработки событий.

Предистория

У меня 5 лет инженерного опыта, включающего в себя .NET (+forms, +WPF, +.NET MVC), Java (+Swing, +Tapestry5, +Groovy), JavaScript (+CoffeeScript, +Node).

Последний год я активно пишу собственное одностраничное веб-приложение работающее без перезагрузки, (о котором речь будет в следующих выпусках). Вся динамическая часть пользовательского интерфейса создается на клиенте, с сервера приходят только данные. Как часто бывает в UI, я имею дело с деревом компонентов. Разумеется, для организации взаимодействия дерева мне нужен механизм отправки и обработки событий. Я решил написать свой, и не использовать Backbone, или что-то из Google Closure. В любом случае у меня был опыт реализации этюда Слушатель (Listener pattern).

Класс ИспускательСобытий первой версии если ты хотел слушать его — просто записывал тебя в массив слушателей. Когда возникало событие «Ч» он обходил массив, и искал слушателей с методом «наЧ», и вызывал его. Типа как в Swing / .NET.

Все отлично работало для небольшого числа Испускателей. С ростом системы пришла проблема перекрытия имен событий между разными Испускателями. Подписчик выполнял один и тот же метод «наЧ», даже если «Ч» исходило от разных Испускателей. Затем был более привычный для JS, EventEmitter, как в jQuery / NodeJS. Не буду особо затягивать…

Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js