Как стать автором
Обновить
19
0

Пользователь

Отправить сообщение

Object.defineProperty или как сделать код капельку лучше

Время на прочтение3 мин
Количество просмотров34K
Этот краткий пост-заметку или температурный бред (в Одессе похолодало, да) хочу посвятить такой прекрасной функции, как Object.defineProperty (и Object.defineProperties). Активно использую её уже около двух месяцев, так как поддержка старых браузеров (в том числе и IE8) в проекте, который я сейчас реализую, не требуется (завидуйте).

Как положено статье на хабре, приведу краткое описание того, что она делает. Object.defineProperty добавляет новое свойство, обладающее неким нестандартным для обычного свойства поведением, и принимает три аргумента:
  • Объект, который мы модифицируем, добавляя новое свойство
  • Свойство (строка), которое, собственно, хотим добавить
  • Дескриптор: объект, содержащий «настройки» нового свойства, например аццессоры (геттер, сеттер)

Дескриптор может содержать следующие свойства:
  • value (любое значение: строка, функция...) — значение, которое получит определяемое свойство объекта (геттер и сеттер в данном случае определить нельзя)
  • writable (true/false) — можно ли перезаписать значение свойства (аццессоры тоже не доступны)
  • get (функция) — геттер (value и writable определить нельзя)
  • set (функция) — сеттер (value и writable определить нельзя)
  • configurable (true/false) — можно ли переопределить дескриптор (использовать Object.defineProperty над тем же свойством)
  • enumerable (true/false) — будет ли свойство перечисляться через for..in и доступно в Object.keys (плохая формулировка)

Пример
Содержимое
// Код сперт с MDN
var o = {};
Object.defineProperty(o, "a", {value : 37,
                               writable : true,
                               enumerable : true,
                               configurable : true});

 
var bValue;
Object.defineProperty(o, "b", {get : function(){ return bValue; },
                               set : function(newValue){ bValue = newValue; },
                               enumerable : true,
                               configurable : true});


Лучше меня объяснит MDN Object/defineProperty. Благо, даже английский знать не надо, и так всё понятно.

Если нужно определить сразу несколько свойств, можно использовать Object.defineProperties, который принимает два аргумента: объект, требующий изменений и объект с определяемыми ключами.
MDN: Object/defineProperties.

Пример
Содержимое
// Код сперт с MDN
Object.defineProperties(obj, {
  "property1": {
    value: true,
    writable: true
  },
  "property2": {
    value: "Hello",
    writable: false
  }
  // etc. etc.
});



Теперь соль. Чего я вообще решил это запостить?
Читать дальше →
Всего голосов 24: ↑20 и ↓4+16
Комментарии9

Погружение в темные воды загрузки скриптов

Время на прочтение12 мин
Количество просмотров102K
image
Буквально несколько часов назад на HTML5 Rocks появилась замечательная статья о текущем положении дел, касающихся загрузки скриптов на странице. Представляю вашему вниманию ее перевод. Поправки можете присылать в личные сообщения.
Читать дальше →
Всего голосов 96: ↑94 и ↓2+92
Комментарии47

Путь JavaScript модуля

Время на прочтение28 мин
Количество просмотров121K


На момент написания этой статьи в JavaScript еще не существовало официальной модульной системы и все эмулировали модули как могли.

Модули или подобные структуры это неотъемлемая часть любого взрослого языка программирования. Просто иначе никак. Модули позволяют ограничить область видимости, позволяют реиспользовать части приложения, делают приложение более структурированным, отделяют ресурсы от шума и вообще делают код нагляднее.

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

Дело в том, что раньше не думали, что на JavaScript можно делать огромные проекты, а не просто «пропатчить DOM», поэтому о модулях не думали. Да и вообще не думали о будущем. И тут Внезапно будущее нагрянуло! Все вроде-бы уже есть, а модули в JavaScript, мягко говоря, запаздывают. Поэтому разработчикам приходится крутиться и выдумывать какие-то эмуляторы модульности.

Думаю многие из вас читали прекрасную статью Addy Osmani Writing Modular JavaScript With AMD, CommonJS & ES Harmony, которая стала одной из глав его книги Learning JavaScript Design Patterns в этой статье рассказывается про «современные» JavaScript модули или же читали достаточно старую статью JavaScript Module Pattern: In-Depth 2010 года про «старые» модули.

Я не буду переводить эти статьи и не буду делать из них солянку. В своей статья я хочу рассказать о моем модульном пути. О том как я проделал путь от «старых» модулей к «новым» и что использую сейчас и почему.
Читать дальше →
Всего голосов 188: ↑185 и ↓3+182
Комментарии71

Ежедневная работа с Git

Время на прочтение40 мин
Количество просмотров875K
Я совсем не долго изучаю и использую git практически везде, где только можно. Однако, за это время я успел многому научиться и хочу поделиться своим опытом с сообществом.

Я постараюсь донести основные идеи, показать как эта VCS помогает разрабатывать проект. Надеюсь, что после прочтения вы сможете ответить на вопросы:
  • можно ли git «подстроить» под тот процесс разработки, который мне нужен?
  • будет ли менеджер и заказчик удовлетворён этим процессом?
  • будет ли легко работать разработчикам?
  • смогут ли новички быстро включиться в процесс?
  • можно ли процесс относительно легко и быстро изменить?


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

Далее очень много букв случайным образом превратились в пост.
Всего голосов 200: ↑194 и ↓6+188
Комментарии44

Работа с моделями данных в javascript

Время на прочтение4 мин
Количество просмотров20K
Здравствуйте, Хабралюди.

Мал по-малу из моего опыта и наших проектов родилась небольшая библиотека для работы с моделями в джаваскрипте. Она так и называется — Model.js.

Я расскажу вам вкратце об этой библиотеке и этим постом запрашиваю обратную связь у тех, кто создавая сложные джаваскрипт-приложения, уже решает эту проблему каким-то определенным образом без фреймворков. Интересно также и мнение тех, кто только подыскивает подходящий инструмент для своих нужд: какой инструмент вам нужен и насколько вам подходит Model.js?
Читать дальше →
Всего голосов 47: ↑41 и ↓6+35
Комментарии36

Серьезное проектирование серьезных сайтов. Часть 1. Аналитика

Время на прочтение13 мин
Количество просмотров121K

Сразу скажу, что статья получилась очень большая. В моем духе. Поэтому я решил разбить её на две части: аналитика и визуализация. А после еще будет несколько статей с логическим продолжением. Первая может показаться сухой из-за большого количества текста, но без неё не сможет существовать вторая. Поэтому, если вы действительно интересуетесь проектированием сайтов, читать нужно обе и внимательно, я постарался избавиться от «воды» и рассказать только о полезном.

Читать дальше →
Всего голосов 50: ↑43 и ↓7+36
Комментарии36

Манипулирование URL'ами в JavaScript

Время на прочтение2 мин
Количество просмотров70K
Из года в год, сталкиваюсь с одной и той же проблемой. Как добавить, изменить или удалить параметр к некоторому адресу в строковом виде. Быстро и грязно это можно делать с помощью, например, регулярных выражений или найти каке-то готовое решение. Зачастую также может потребоваться, к примеру, подменить путь в адресе или изменить протокол с HTTP на HTTPS и т.д.

В целом, это хочется делать просто и понятно. При этом хочется разумного компромиса. Я встречал некоторые библиотеки, которые дают мощный функционал, но при этом по объему — десятки килобайт JavaScript кода. Несколько десятков килобайт, чтобы, например, подменить параметр в QueryString? Эх…
Читать дальше →
Всего голосов 70: ↑67 и ↓3+64
Комментарии50

Используем console на полную

Время на прочтение6 мин
Количество просмотров457K
Метод console.log() — отличный способ вывести отладочную информацию, не мешая пользователю. Но знаете ли Вы, что объект console имеет еще уйму других не менее полезных методов? Очень редко разработчики используют этот функционал, ограничиваясь неблокирующим alert'ом. Что-ж, давайте исправим это положение.

Вкусности console
Всего голосов 172: ↑168 и ↓4+164
Комментарии29

Закрепляем jQuery — 25 отличных советов

Время на прочтение19 мин
Количество просмотров168K
Перевод отличной статейки. Думаю, будет полезна как новичкам, которые только приступили к использованию jQuery, так и тем, кто уже какое-то время с ним работает. А кого-то, возможно, заставит глянуть эту чудесную библиотечку. Многие советы имеют отношение не только к jQuery, но и к JavaScript в целом. Лично для меня была весьма и весьма познавательной, посему и захотелось донести это «до масс». Перевод не дословный, но передающий смысл и максимально адаптированный к русскому языку.

Далее все написано от имени автора оригинальной статьи.

Введение


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

Я не эксперт в jQuery. И даже не претендую, поэтому, если встретите ошибки, смело поправляйте меня и вносите предложения по улучшению (поправлять и присылать поправки нужно автору статьи, а не перевода — зам. пер.).

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

Содержание


  1. Загружайте фреймворк с Google Code
  2. Используйте «шпаргалку» (cheat sheet)
  3. Соединяйте все ваши скрипты и уменьшайте размер файла
  4. Используйте возможности Firebug для ведения логов
  5. Минимизируйте операции выборки в пользу кэширования
  6. Сводите манипуляции с DOM-деревом к минимуму
  7. Оборачивайте все в единый элемент, когда речь идет о любой вставке в DOM
  8. Используйте «id» вместо классов, где это возможно
  9. Задайте контекст своим селекторам
  10. Используйте последовательности вызовов методов с умом
  11. Научитесь правильно использовать анимацию
  12. Научитесь назначать и делегировать события
  13. Используйте классы для сохранения состояния
  14. Еще лучше — используйте встроенный в jQuery метод data() для сохранения состояния
  15. Пишите собственные селекторы
  16. Подготавливайте HTML и модифицируйте его, когда страница загружена
  17. Используйте «отложенную загрузку» (lazy loading) для определенного контента для выигрыша в общей скорости и преимуществ для SEO
  18. Используйте служебные функции jQuery
  19. Используйте «noconflict» для переименования глобального объекта «jquery», когда используете его с другими фреймворками
  20. Как узнать что картинки загружены?
  21. Всегда используйте последнюю версию
  22. Как проверить, что элемент существует?
  23. Добавляйте класс «JS» в элемент «html»
  24. Возвращайте «false» для отмены поведения по-умолчанию
  25. Короткая запись для события готовности документа


Rock'n'Roll!
Всего голосов 188: ↑182 и ↓6+176
Комментарии109

50 потрясающих плагинов jQuery

Время на прочтение1 мин
Количество просмотров88K

Кто-то вчера шутил, а кто-то занимался реально полезными вещами. Как например болгарский разработчик Мартин Ангелов, опубликовавший впечатляющий обзор JS библиотек:
http://tutorialzine.com/2013/04/50-amazing-jquery-plugins/
Настоятельно рекомендуется к обозрению.
PS Куда-то пропал тип топика «Ссылка» :(
Всего голосов 121: ↑76 и ↓45+31
Комментарии20

Поднимаем WebSocket сервер

Время на прочтение5 мин
Количество просмотров70K
Многие уже наслышаны о революции в расширении HTTP протокола — внедрении технологии WebSocket разработчиками Google Chromium. В данной статье речь пойдет о том, как приручить данного зверя — установке и настройке WebSocket сервера на асинхронном фреймворке phpDaemon.
Читать дальше →
Всего голосов 8: ↑6 и ↓2+4
Комментарии21

WebSockets — полноценный асинхронный веб

Время на прочтение7 мин
Количество просмотров344K
Пару недель назад разработчики Google Chromium опубликовали новость о поддержке технологии WebSocket. В айтишном буржунете новость произвела эффект разорвавшейся бомбы. В тот же день различные очень известные айтишники опробовали новинку и оставили восторженные отзывы в своих блогах. Моментально разработчики самых разных серверов/библиотек/фреймворков (в их числе Apache, EventMachine, Twisted, MochiWeb и т.д.) объявили о том, что поддержка ВебСокетов будет реализована в их продуктах в ближайшее время.
Что же такого интересного сулит нам технология? На мой взгляд, WebSocket — это самое кардинальное расширение протокола HTTP с его появления. Это не финтифлюшки, это сдвиг  парадигмы HTTP. Изначально синхронный протокол, построенный по модели «запрос — ответ», становится полностью асинхронным и симметричным. Теперь уже нет клиента и сервера с фиксированными ролями, а есть два равноправных участника обмена данными. Каждый работает сам по себе, и когда надо отправляет данные другому. Отправил — и пошел дальше, ничего ждать не надо. Вторая сторона ответит, когда захочет — может не сразу, а может и вообще не ответит. Протокол дает полную свободу в обмене данными, вам решать как это использовать.

Я считаю, что веб сокеты придутся ко двору, если вы разрабатываете:
— веб-приложения с интенсивным обменом данными, требовательные к скорости обмена и каналу;
— приложения, следующие стандартам;
— «долгоиграющие» веб-приложения;
— комплексные приложения со множеством различных асинхронных блоков на странице;
— кросс-доменные приложения.

Заинтриговал? Давайте посмотрим подробнее
Всего голосов 222: ↑210 и ↓12+198
Комментарии389

Chrome extension — с шахматами и библиотекаршами

Время на прочтение3 мин
Количество просмотров18K
Добрый день, любители ездить на чужих велосипедах, у которых нет сиденья, педали надо крутить руками, а тормоза появятся через пару релизов.

Задача:
Создать расширение для браузера Chrome, которое сможет в любой из открытых табов внедрить необходимый контент и небольшой управляющий модуль для него, и если этот контент внедрен в несколько разных табов, то управляющие модули должны иметь возможность между собой общаться.

Доступные инструменты:
Content Scripts, Background Pages, Message Passing

Алгоритм решения:
Создать общий управляющий модуль который будет создавать модули потомки и управлять ими, наладить с каждым из них механизм обратной связи.

Читать дальше →
Всего голосов 15: ↑11 и ↓4+7
Комментарии5

Надежный код при высоких нагрузках

Время на прочтение6 мин
Количество просмотров37K
Когда речь идет о высоких нагрузках, как правило, в центре внимания оказываются вопросы производительности или масштабируемости кода и архитектуры.

При этом о надежности самого кода говорить как-то не принято, хотя в суровых условиях высоконагруженных проектов его качество приобретает особое значение. Вам нужен действительно «пуленепробиваемый» код, который будет работать корректно даже в случае большого количества одновременных запросов к одним и тем же данным. В этой статье представлен набор рекомендаций, которые могут помочь вам в написании такого кода.
Читать дальше →
Всего голосов 104: ↑91 и ↓13+78
Комментарии42

Расширения для Google Chrome. Часть первая. Getting started

Время на прочтение7 мин
Количество просмотров59K
Добрый день, Хабр.

Я хочу написать цикл статей о создании расширений для Google Chrome. К этому меня побуждает, во-первых, практическая польза самого процесса разработки и последующего использования: вы сами определяете, какие ещё задачи хотите решить не выходя из браузера и, во-вторых, отсутствие каких-либо внятных гайдов, туториалов и справочников на русском языке, за исключением, пожалуй, этой и вот этой статей на Хабре. Основная цель цикла — систематизировать разрозненную информацию и облегчить поиск потенциальным разработчикам, благо индексируется Хабр хорошо :)

В первой (этой, то бишь) статье, на примере простейшего расширения, будут рассмотрены все основные моменты, связанные с разработкой, отладкой и использованием расширения, конфигурационный файл manifest.json и начала chrome.* API. Первая же статья, думаю, будет не очень полезна опытным разработчикам (это дисклеймер).
Читать дальше →
Всего голосов 108: ↑95 и ↓13+82
Комментарии39

Введение в Zend Framework (продолжение)

Время на прочтение12 мин
Количество просмотров17K
Продолжаем рассказ о Zend Framework. В первой части статьи была описана концепция программной архитектуры MVC, рассмотрена структура типового веб-приложения, базирующегося на Zend Framework и выполнена демонстрационная реализация контроллера и вида на его основе. Во второй части будет раскрыта тема модели и приведен пример взаимодействия приложения с базой данных.
Читать дальше →
Всего голосов 35: ↑27 и ↓8+19
Комментарии29

Введение в Zend Framework

Время на прочтение17 мин
Количество просмотров106K
Update (2014): Это статья 2007 года, которая, к моему удивлению, до сих пор пользуется спросом. По этой причине я обновил её в соответствии с новыми правилами оформления постов на Хабре, и добавил подсветку синтаксиса для примеров кода. Если кому-то захочется что-то добавить или исправить, исходник текста с хабра-разметкой выложен в открытый доступ: gist.github.com/dreikanter/2b4ee996d7a775e707d7

Аннотация от переводчика


PHP — один из самых широко распространенных языков разработки веб-приложений и при этом один из самых спорных. Я очень часто видел негативное отношение к этой технологии, да и недостатки, провоцирующие это отношение — не для кого не являются секретом. Тем не менее, PHP активно эволюционирует и во многих отношениях постепенно становитс лучше. Одним из серьезных шагов его развития, на мой взгляд, является появление MVC-фреймворков, призванных систематизировать процесс разработки веб-приложений и приучить к порядку разработчиков, которым зачастую здорово не хватает силы воли, чтобы при всей предоставляемой языком свободе, сохранить грамотную и красивую инфраструктуру разрабатываемого ПО (сразу уточню, что последнее утверждение субъективно и основано исключительно на виденном мной коде различных программных решений).

В последнее время я активно заинтересовался архитектурой MVC и сделал свою собственную реализацию фреймворка на этой концепции для PHP4. Совсем недавно на глаза попался первый официальный релиз Zend Framework, о котором я давно слышал, но все руки не доходили с ним поиграть. Для PHP существуют и другие подобный библиотеки, но в данном случае привлек бренд.
Читать дальше →
Всего голосов 52: ↑51 и ↓1+50
Комментарии158

Информация

В рейтинге
Не участвует
Откуда
Запорожье, Запорожская обл., Украина
Зарегистрирован
Активность