Хабрахабр: Web-разработка / Блог / Захабренные Голосов: 1 Адрес блога: http://habrahabr.ru/blog/webdev/ Добавлен: 2008-06-12 19:52:21 блограйдером ZaiSL

Derby.js темы для темплейтов

2013-11-04 21:39:32 (читать в оригинале)

Derby.js предлагает механизм, который позволяет значительно повысить скорость загрузки страницы путем инкапсуляции CSS в HTML код отдаваемый клиенту. В production mode Derby.js минифицирует HTML, CSS, JS. Как указано в документации используются Stylus и/или LESS.
По умолчанию подключается файл: styles/app/index.styl, где мы можем воспользоваться всеми синтаксическими преимуществами которые предоставляет Stylus.
Что делать, если в нашем проекте предусмотрено использование нескольких тем (стилей) для темплейтов?
Подробности

---

Harmony collections NOW

2013-11-04 17:02:34 (читать в оригинале)


На хабре уже проскакивала статья про такие замечательные вещи, как Map, WeakMap и Set, но в действительности реальные возможности этих API не были раскрыты (если я все-таки хорошо воспользовался поиском).
Эти API толком не реализованы нигде, кроме firefox (можно включить в chrome canary), но даже там до недавних пор не поддерживалось использование HTMLElement-подобных объектов в качестве ключей. Polymer, например, убрал только три недели назад

	if (navigator.userAgent.indexOf('Firefox/') > -1)

Чем же они так хороши? По сути Map/WeakMap можно воспринимать как обычные хэш-объекты, только в качестве ключей можно использовать только сложные объекты (Object, Function, Array), так как привязка идет не по содержимому, а по адресу в памяти.
Таким образом появляется возможность привязаться на фронтэнде к

• dom-элементу
• XHR-запросу
• File-элементу

Это дает нам возможность работать без id-шников элементов, делать дата-биндинг в разы быстрее, создать безумную альтернативную реализацию promises и так далее.
Мы будем говорить о WeakMap. Даже не так, мы будем говорить о существующих полифиллах для WeakMap.

Читать дальше →

---

[Перевод] Дизайнер, архитектор и разработчик

2013-11-04 15:09:16 (читать в оригинале)

За последние шесть лет я добился успеха с тремя моими компаниями («Cube6 Media», «Gravatar» и «GitHub»), и потерпел неудачу с парой других проектов. Я много думал над тем, как все получилось, и определил 3 основных роли, которые необходимы для создания успешных веб-приложений: дизайнер, архитектор и разработчик.

В колледже я провел много времени в комнате с тусклым красным светом, погружая фотопленку и листы бумаги в реактивы. Я вставлял негативы в фотоувеличитель, и печатал изображения на бумаге. Это меня впечатляло. каждый раз, когда я включал яркий свет проектора, я вспоминал поговорку: «Фотография — не более чем рисование светом». На секунду задумайтесь об этом. Когда мы смотрим на фотографию — мы видим только свет, который попал в кадр. Никакие вспышки, софт-боксы, отражатели и задники не помогут вам сделать хорошую фотографию, если свет, который они создают или отражают, направлен неверно. Плохой свет — плохая фотография.

Думаю, эта метафора подходит и для веб-разработки

---

Пишем single-page web application framework в 60 строках кода

2013-11-04 08:54:21 (читать в оригинале)

В качестве предисловия

Веб-дизайнерский народ в последнее время распробовал single page web applications. Что оправдано во многих случаях.
Но явно ошибочно считать что single page web application не сделать без чего-то типа AngularJS, Ember и прочих Knockouts.
Во всяком случае если вам нужно сделать нечто простое типа To-do списка совершенно не обязательно тащить на клиент килобайты мега-фреймворка. На самом деле килобайты трафика это пол беды. Основная цена, скажем AngularJS, в том что он, как любой универсальный data binding механизм, создает значительную run-time нагрузку.

Эта статья про то как в 60 строках кода + jQuery/Zepto сделать простой app framework котрый можно расширять под свои нужды и без лишних сущностей в нагрузку.

Постановка задачи

Наш framework должен ...:

1. … поддерживать routing, т.е. должна быть возможность сказать в деклартивной модели: «этот вот url hash должен быть показан в этом view».
2. Должна быть возможность динамической загрузки разных view. Какие-то части нашего прилжения могут быть либо тяжелы для начальной загрузки либо не нужны например для незалогиненного пользователя.
3. Должна быть возможность динамической загрузки скриптов. По причинам изложенным в п. 2
4. Наше приложение будет поддерживать browsing history — кнопка «назад» в браузере должна показывать предыдущую страницу и т.д.
5. Ну и все это должно быть компактным и расширяемым как того будет требовать логика нашего приложения.

Пример того что мы хотим получить

Приложение Bootstrap'нутый список контактов — содержит сам список, карточку — детали контакта и некую панель управления (dashboard). Что будет на той панели нам не важно — знаем что что-то будет и ладно.



Поехали

---

Библиотека X.Scaffolding

2013-11-03 21:16:53 (читать в оригинале)



С выходом Visual Studio 2013, ASP.NET MVC 5 и Entity Framework 6 возможности скаффолдинга встроенные в Visual Studio стали еще лучше. Однако до сих пор создавая новое веб-приложение приходится делать много действий, которые можно было бы автоматизировать.
Поэтому для себя и разработчиков с которыми я работаю был создан пакет X.Scaffolding позволяющий более продуктивно создавать веб-приложения. Именно на основе этого пакета у нас сейчас разрабатывается большинство новых веб-приложений для работы с данными.

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