Несколько интересностей и полезностей для веб-разработчика #11

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

    Node App



    Вы когда нибудь задумывались о возможности писать приложения для iOS и OSX на Node.js? А проект, позволяющий решить эту задачу уже есть. Более того часть (хоть и маленькая) функционала доступна уже сейчас. Пишу о проекте с мыслями о том, что хабраобщество значимая единица социального коддинга…

    Scala.js


    Существует достаточно много разработчиков, предпочитающих создавать веб на Scala, но JavaScript остается самым популярным языком программирования. Видимо, поэтому на свет появился Scala.js — компилятор Scala в JavaScript с очень проработанной функциональной совместимостью.

    Hackathon Starter



    Замечательный boilerplate для Node.js проектов. Базовая регистрация через email, авторизация по OAuth (Twitter, Facebook, GitHub, Google), красивые уведомления на animate.css, автокомпиляция LESS, Bootstrap 3 + Flat UI + iOS7 Theme, контактная форма и стандартный функционал управления аккаунтом.


    InstantClick



    Маленький (1.6 кб в gzip), но очень полезный скрипт, позволяющий заметно ускорить загрузку страниц. Все дело в том, что промежуток времени между наведением и кликом на ссылку в среднем составляет 200 — 300 миллисекунд (в этом можно убедиться на специальной странице). Инстантклик использует это время и начинает подгрузку документа при наведении на ссылку. В нем используется pushState (HTML5 History API) и AJAX.

    <a href="some-page.html" data-instant>Link</a> <!-- Белый список ссылок -->
    <a href="/blog/" data-no-instant>Blog</a> <!-- Черный список  -->
    ...
    <script src="instantclick.min.js" data-no-instant></script>
    <script data-no-instant>InstantClick.init();</script>
    </body>
    </html>
    


    Dug.js — A JSONP to HTML Script



    Изящное решение при работе с JSONP, если вы хотите отобразить последние комментарии с GitHub, снимки с Instagram или 500px, шоты с Dribble, пины с Pinterest или что-нибудь другое.

    <script>
      dug({
          endpoint: 'http://api.dribbble.com/players/justinmezzell/shots',
          template: '<ul>\
              {{#shots}}\
                <li>\
                    <a href="{{url}}" title="{{title}}">\
                        <img src="{{image_400_url}}" alt="Image of {{title}}">\
                    </a>\
                </li>\
            {{/shots}}\
          </ul>'
      });
    </script>
    


    Editor — простой и качественный Markdown редактор




    Напоследок:


    • Codecombat — очень интересная идея — геймифицированный способ обучения программированию.

    • iCheck — кастомные кроссплатформенные радио и чекбокс кнопки для jQuery и Zepto.
    • Tether — легко и просто привязываем друг к другу абсолютно позиционированные элементы.
    • Hover.css — большая коллекция реалистичных CSS анимаций, достойный конкурент animo.css.
    • Epub.js — отныне eBook может быть в вашем браузере на любом устройстве.
    • Math.js — обширная библиотека с множеством математических функций.
    • Codebox — Open source cloud & desktop IDE.
    • WordPress to Jekyll Exporter — ввиду популярности Jekyll, решил поделиться этим WP плагином.
    • BitDeli — статистика по вашему GitHub аккаунта и репозиториям.
    • Vafpress — неплохая надстройка над WordPress.
    • Grafana — графики и дашборды для самых ненасытных.
    • You might not need jQuery.


                                                              Предыдущая подборка (Выпуск 10)

    Приношу извинения за возможные опечатки. Если вы заметили проблему — напишите, пожалуйста, в личку.

    Only registered users can participate in poll. Log in, please.

    Понравилась ли Вам подборка?

    • 90.6%Да840
    • 9.4%Нет87
    Support the author
    Share post
    AdBlock has stolen the banner, but banners are not teeth — they will be back

    More
    Ads

    Comments 13

      +2
      Как всегда отличная подборка, спасибо!
      P.S. Особенно за InstantClick, испробую в самое ближайшее время.
        0
        Спасибо. Скорее всего InstantClick мне тоже нравится больше всего
        0
        А чем nodeapp отличается от Титаниума и тайд-сдк (тайдкита)?
          +1
          afair у scala.js рантайм весит ~16 метров, так что сомнительный инструмент.
            +3
            насчет scalajs, то имхо другой аналогичный проект — jscala.org заслуживает куда большего внимания, см. Требования к языкам, компилирующимся в JS.
              +3
              InstantClick — огонь! Ведь знал же, что у контактика так работает…
                0
                >>Grafana — графики и дашборды для самых ненасытных

                Grafana не пробовал, мне больше нравится работать с highcharts
                www.highcharts.com/demo/line-time-series
                  +1
                  Grafana ето средство для мониторинга, не для разработчика. Если вьі используете Graphite для собирания и анализа различньіх метрик производительности ваших сервисов, то встроеного dashboard вам может не хватать.
                  Grafana отлично визуализирует данньіе из Graphite, інтерфейс очень гибкий, (намного понятнее Graph-Explorer). Кроме того, уже умеет работать с InfluxDB (новьій парень на районе time-series database).
                  0
                  А что такого в Node App?
                  Я сейчас играюсь с apache cordova — там все то же самое, плюс нормальный интерфейс сваять можно.
                  А либы ноды можно и через browserify подцепить.
                    0
                    instantclick.io/click-test.html

                    FF
                    image

                    Chome
                    image

                    Что я делаю не так?
                      +4
                      А что именно «не так»? У вас для обоих типов ссылок задержка около 400 милисекунд до момента клика от наведения на ссылку и около 145 с момента нажатия кнопки мыши вниз. Итого загружая ссылку заранее — субъективно будет казаться, что она срабатывает в разы быстрее.
                      0
                      scala.js — вообще не понимаю зачем сделали: производительность однозначно пострадает, и удобство не понятно в чём заключается.
                      мода такая мода…
                        0
                        Никто еще не столкнулся с проблемой совместимости: InstantClick.js + jquery.history.js?

                        Only users with full accounts can post comments. Log in, please.