• Piecon — динамическая круговая диаграмма в фавиконе


      Крошечная (2 килобайта в минифицированном виде) JavaScript-библиотека Piecon генерирует круговую диаграмму на месте фавикона. API предельно прост и состоит из трёх методов объекта Piecon.
      Читать дальше →
    • Поверхностный обзор javascript-enabled BaaS платформ

      Будучи начинающим javascript разработчиком, я заинтересовался темой межплатформенной разработки мобильных приложений. В этой области, в настоящее время, балом правят Cordova (phonegap) www.phonegap.com, Appcelerator Titanium www.appcelerator.com, Mosync www.mosync.com.

      Рано или поздно, после выпуска первых мини-приложений, основанных на этих системах, разработчику захочется создать что-нибудь Большое и Светлое, и хотелось бы, чтоб в этом новом приложении/сервисе были пользователи (c аватарами и проч.), push-notifications, user-generated-content и т.д… Но при этом, не хотелось бы тратить время и деньги на написание своей серверной инфраструктуры, а хотелось бы воспользоваться чем-нибудь недорогим, вплоть до бесплатного, и простым в освоении (и ещё чтоб «в облаке»!).

      Как раз подобного рода тяжести и взяли на себя многочисленные Backend-as-a-Service (не путать с другими aaS). Я хочу кратко пробежаться по некоторым игрокам на этом рынке. Подчеркну, что меня в первую очередь интересовали те платформы, которые можно было бы легко и безопасно использовать с мобильным javascript (Phonegap/Titanium). Если платформа просто предоставляет REST API, этого мало, т.к. вопрос безопасности требует наличия некоторого специального ограничительного функционала: AccessControlList/permissions/masterKeys/etc. И вообще, желательно отдельный javascript SDK.

      (Так как это «поверхностный обзор», я не буду подробно писать кому и зачем нужен BaaS и почему вместо всего этого не использовать старый-добрый PHP/MySQL на VPS или новый-добрый node.js в облаке)

      Я начал поиск с www.programmableweb.com/apis/directory/1?apicat=Backend там перечислено почти 40 платформ, просмотрев их, я оставил для обзора те, что легко можно использовать с javascript:
      Читать дальше →
    • Разработка плагина для PhoneGap

        В настоящее время развитие кроссплатформенной разработки мобильных приложений набирает всё большие обороты. В этой статье я бы хотела обратить внимание на еще одно средство для реализации таких приложений — PhoneGap. Это бесплатный фреймворк с открытым исходным кодом для создания мобильных приложений.

        PhoneGap позволяет создавать iOS, Android, Windows Phone, BlackBerry, Bada, Symbian, webOS приложения на HTML с использованием JavaScript. Количество скачиваний данного фреймворка уже привысило 1 миллион, а количество разработчиков достигает 400 000.


        Читать дальше →
      • Vanilla JS — очень мощный javascript-фреймворк

        Как ни странно, на Хабре упоминание этого мощнейшего фреймворка нашлось лишь в одном комментарии от апреля 2012 года.

        Вступление


        Для меня эта тема особенно актуальна, ведь последнее время на Хабре упоминается огромное количество js-фреймворков. Какие-то из них авторы различных проектов находят в Сети, какие-то — пишут сами, не очень понимая зачем. Кто-то просто пишет свои велосипеды.

        Моё же мнение — надо стремиться к отсутствию избыточного кода, к максимальному минимализму, простите за тавтологию.
        Если на весь сайт вам нужно только выбирать html-элементы по их id — глупо подключать jQuery.

        Если вам на Node.js проекте надо собрать пачку js-файлов и сжать их — глупо писать или подключать тяжёлые фреймворки с кучей настроек, параметров, дополнений и методов, ведь простейший скрипт, склеивающий файлы и прогоняющий их через Кроукфордский jsmin будет намного быстрее, надёжнее и проще.

        Чем больше кода — тем больше ошибок. Чем больше стороннего кода — тем сложнее поддерживать проект. Ведь когда вы берёте чужой код, вы берёте на себя и ответственность за его поддержку. Нельзя будет сказать «этот баг не мой, а вон из той библиотеки».

        Vanilla JS


        Итак, начнём обзор этого мощнейшего и самого популярного в мире JS-фреймворка.
      • Компания Atari в партнёрстве с Microsoft запустила свои старые игры в онлайн

          Сегодня издатель и разработчик компьютерных игр Atari выложил специально адаптированные для веб-браузеров игры Atari Arcade. Среди тайтлов есть Asteroids, Centipede, Combat, Lunar Lander, Missile Command, Yars Revenge, Pong и Super Breakout, а другие будут добавлены позже. Техническим партнёром выступила Microsoft, что, естественно, привело к тому, что наилучшие впечатления от игры можно получить на Internet Explorer 10 под Windows 8 с тачевым управлением.
          Пользователи других браузеров будут видеть рекламу. Pong на Chrome 22 под Windows 7 работал сносно, хотя потом повис, и вкладка упала. Игры тут.
          Разработчикам за js-либами и сэмплами прямиком сюда.
        • Нормальное профилирование node.js приложений

            Предисловие


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

            Поиски


            Долгое время я обходился консервативными методами отладки в виде периодического вывода объёма используемой памяти и времени выполнения критических участков кода в консоль, но настал момент, когда необходимость наличия качественного инструмента встала очень остро.

            Первым делом я решил посмотреть не оправился ли node-inspector, который после перехода на node.js 0.6.x перестал поддерживать профилирование CPU и Heap. Оказалось, что в новой версии node-inspector неработающий профайлинг окончательно исключён и теперь это просто debugger. Немного покопавшись в коде старой версии, мне всё же удалось завести профилирование CPU и Heap на node 0.8.x, однако это решение не было идеальным. Чтобы вывести его из состояния «поделки» необходимо было бы заменить устаревший интерфейс WebKit-консоли на современный, переписав приличное количество кода и исправить некоторые проблемы производительности. В целом, решение на основе консоли WebKit мне кажется очень не гибким, поэтому я бросил эту затею и продолжил поиски.

            Вот оно


            Читать дальше →
          • Основы и заблуждения насчет JavaScript

              Объекты, классы, конструкторы

              ECMAScript, будучи высоко-абстрактным объектно-ориентированным языком программирования, оперирует объектами. Существуют также и примитивы, но и они, когда требуется, также преобразуются в объекты. Объект — это коллекция свойств, имеющая также связанный с ней объект-прототип. Прототипом является либо также объект, или же значение null.
              В JavaScript нет привычных классов, но есть функции-конструкторы, порождающие объекты по определенным алгоритмам (см. Оператор new).

              Прототипное делегирующее наследование


              Классическое наследование очень похоже на то, как люди наследуют гены своих предков. Есть какие-то базовые особенности: люди могут ходить, говорить… И есть характерные черты для для каждого человека. Люди не в состоянии изменить себя — свой класс (но могут поменять собственные свойства) и бабушки, дедушки, мамы и папы не могут динамически повлиять на гены детей и внуков. Все очень по земному.

              Теперь представим другую планету, на которой не такое как на Земле генное наследование. Там обитают мутанты с «телепатическим наследованием», которые способны изменять гены своих потомков.
              Разберем пример. Отец наследует гены от Дедушки, а Сын наследует гены от Отца, который наследует от Дедушки. Каждый мутант может свободно мутировать, и может менять гены своих потомков. Например у Дедушки был зеленый цвет кожи, Отец цвет унаследовал, Сын тоже унаследовал цвет. И вдруг Дед решил: «надоело мне ходить зеленым — хочу стать сними», смутировал (изменил прототип своего класса) и «телепатически» распространил эту мутацию Отцу и Сыну, вобщем посинели все. Тут Отец подумал: «Дед на старости лет совсем двинулся» и поменял свой цвет в генах обратно на зеленый(изменил прототип своего класса), и распространил «телепатически» свой цвет сыну. Отец и Сын зеленые, Дед синий. Теперь как бы дед ни старался Отец и сын цвет не поменяют, т.к сейчас Отец в своем прототипе прописал цвет, а Сын в первую очередь унаследует от Прототипа Отца. Теперь Сын решает: «Поменяю ка я свой цвет на черный, а моё потомство пусть наследует цвет от Отца» и прописал собственное свойство, которое не влияет на потомство. И так далее.
              Читать дальше →
            • Google Analytics для сбора ошибок JavaScript

                image
                Не так давно на Хабре была статья про навороченный стартап, заточенный на сбор ошибок JavaScript. Далеко не всегда нужно столько возможностей, но оказалось, что многие просто не знают про старый бородатый способ с Google Analytics. Про него я и попытаюсь кратенько рассказать.
                Читать дальше →
              • Подборка CSS3-генераторов для упрощения фронтэнд-разработки

                • Translation
                CSS3 предоставляет много новых возможностей в мире фронтэнд-разработки. Это действительно великолепная вещь, но иногда трудно вспомнить некоторые параметры, особенно, если вы — веб-дизайнер, а не программист. Вот 10 удивительных CSS3-генераторов, которые помогут вам сэкономить время и силы (картинки кликабельны).
                Читать дальше →
              • Практикум AngularJS — разработка административной панели

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

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

                Всем известный jQuery-плагин tablesorter с tablesorterPager-ом и менее известный, но гораздо более функциональный DataTables хороши, но обладают некоторыми недостатками. Главный из них — сложность динамического добавления новых строк в таблицу (после добавления строки в таблицу, новая строка потеряется при следующем вызове сортировки). tablesorter вообще не даёт средств для добавления строки в свой кэш, DataTables предоставляет широкое и функциональное API для управления внутренним представлением таблицы, но это API довольно многословно и не очень гибко.

                Хочу предоставить общественности реализацию админки на относительно новой javascript-фреймворке AngularJS. Будет создана страничка для редактирования списка вопросов, разбитых по категориям и отвечающим. В статье нет сравнения с другими подобными фреймворками, но нет и простого повторения официальной документации, я постараюсь поделиться своим опытом в использовании фреймворка и расскажу о нескольких интересных приёмах работы с ним.

                Сразу приведу, что получится в итоге (кликабельно):


                Читать дальше →
              • Миллион одновременных соединений на Node.js



                  TL;DR:


                  • Node.js v0.8 позволяет обрабатывать 1 млн одновременных HTTP Comet соединений на Intel Core i7 Quad/16 Gb RAM практически без дополнительных настроек.
                  • На 1 соединение тратится чуть больше 10 Kb памяти (4.1 Kb Javascript Heap + 2.2 Kb Node.js Native + 3.8 Kb Kernel)..
                  • V8 Garbage Collector не рассчитан на управление > ~500Mb памяти. При превышении нужно переходить на альтернативный режим сборки мусора, иначе «отзывчивость» сервера сильно уменьшается.
                  • Подобный опыт можно (и нужно!) без особых затрат повторить самому (см. под катом).

                  Читать дальше →
                • JavaScript F.A.Q: Часть 1

                    image

                    Несколько дней назад мы с TheShock создали топик в котором собирали ваши вопросы, касательно JavaScript (архитектура, фрэймворки, проблемы). Настало время ответить на них. Мы получили очень много вопросов, как в комментариях так и по email. Эта первая часть ответов — те вопросы, которые достались мне.
                    Читать дальше →
                  • Лексическая область видимости функций в JavaScript

                      Почитав недавние посты для новичков JavaScript, решил написать небольшой топик про один интересный вопрос, которого ни один из авторов пока не касался, а именно, вопрос про область видимости функций в JavaScript.
                      Читать дальше →