Мой javascript-редактор
 

Опишите, пожалуйста, свой javascript-редактор/IDE для разработки. Пусть читатели этой темы знают, какой редактор на что способен и смогут выбрать подходящий для себя.

Для описания предлагается такая схема (по мотивам топика "что для вас важно в javascript-редакторе"):

--- автокомплит ---
Уровни поддержки:
1) по символам в файле
2) учет прототипа/структуры объекта
3) учет других javascript-файлов проекта
4) получение информации о типе из специальных комментариев (ScriptDoc, Intellisense и т.п.))
5) поддержка основных javascript-фреймворков

Например:
function MyClass() {
this.method = function() {}
}
MyClass.prototype.protoMethod = function() {}

function blabla() {}

myVar = new MyClass()

myVar.... автокомплит
1) редактор предложит все символы из файла, включая blabla
2) редактор предложит method и protoMethod, но не blabla
3) редактор также рассмотрит другие файлы проекта
4,5) self-descriptive

Возможно несколько уровней, например: 2+3+4 (Intellij IDEA)

--- фолдинг(сворачивание участков кода) ---
Уровни поддержки:
1) на уровне функций
2) ур. 1 + на уровне блоков
3) ур. 2 + на уровне комментариев

--- подсветка и проверка синтаксиса --
Уровни поддержки:
1) Есть в файлах .js
2) Правильно интегрировано с HTML/шаблонами
3) Есть проверка синтаксиса

--- быстрота ---
Уровень оценивается субъективно, оценкой от 1(медленнее некуда) до 10 (летает).
1) Скорость запуска
2) Дальнейшая работа

--- структура кода ---
Уровни поддержки:
1) Возможность перейти к определению переменной/функции(go to definition)
2) Возможность переименовать везде (рефакторинг)
3) Возможность просмотра и навигации по коду, используя структуру (outline)

--- сниппеты ---
Уровни поддержки:
1) Вставка куска кода по хоткею
2) Вставка сниппета на основе выделенного блока кода.
Например: обрамление комментариями, окружение if, try..catch
3) Вставка сниппетов по шаблону, например: f( разворачивается в function()


--- кастомизация ---
Уровни поддержки:
1) Можно добавить (заскриптовать) какие-то действия с выделенным кодом,
более умные, чем шаблон, например, с использованием внешних программ

--- отладка ---
Уровни поддержки:
1) Есть некий отладчик (подробнее?)
2) Интеграция с браузерами (Firefox, Internet Explorer)

--- операционные системы ---
Windows, Linux, Mac support ?

--- стоимость ---
Сколько стоит?

Пожалуйста, указывайте не только что возможность есть, но и КАК ее задействовать. Многие пользуются редакторами и IDE, не зная всех их возможностей.

Спасибо!

EmEditor.

Всё, что я описывал:

* подстветка (с возможностью своих конфигов);
* автокомплит (с возможностью своих конфигов + текущие слова в документе);
* сниппеты;
* прямоугольные выделения;
* обрамление текста (коммент, блоки);
* передача выделения внешней программе;
* макросы (фактически, любая дополнительная автоматизация);
* легковестный;
* хорошо работает с большими файлами;
* фолдинг/outline (не пользуюсь);

Price: $39.99.

Редактор WebIDE (Intellij IDEA)

--- автокомплит ---
Уровни поддержки:
1) по символам в файле
да

2) учет прототипа/структуры объекта
да

3) учет других javascript-файлов проекта
да

4) получение информации о типе из специальных
комментариев (ScriptDoc, Intellisense и т.п.))
да, jsdoc

5) поддержка основных javascript-фреймворков
Да, для тех, у которых есть jsdoc.
Например, для jquery - нужно скачать jsdoc: http://code.google.com/p/jquery-jsdoc/downloads/list .

--- фолдинг(сворачивание участков кода) ---
Уровни поддержки:
1) на уровне функций
2) ур. 1 + на уровне блоков
3) ур. 2 + на уровне комментариев

Да, ур. 3

--- подсветка и анализ синтаксического дерева --
Уровни поддержки:
1) Есть в файлах .js + проверка синтаксиса
2) Правильно интегрировано с HTML/шаблонами, учтена проверка синтаксиса

Да

--- быстрота ---
Уровень оценивается субъективно, оценкой от 1 до 10

1) Скорость запуска 3
2) Дальнейшая работа 7


--- структура кода ---
Уровни поддержки:
1) Возможность перейти к определению переменной/функции(go to definition)
да, ctrl+b

2) Возможность переименовать везде (рефакторинг)
да, shift+f6 на названии

3) Возможность просмотра и навигации по коду, используя структуру (outline)
да, режим проекта Structure

--- сниппеты ---
Уровни поддержки:
1) Вставка куска кода по хоткею
2) Вставка сниппета на основе выделенного блока кода.
Например: обрамление комментариями, окружение if, try..catch
3) Вставка сниппетов по шаблону, например: f( разворачивается в function()

1,2,3) да
Для сниппетов - live templates

--- кастомизация ---
Уровни поддержки:
1) Можно добавить (заскриптовать) какие-то действия с выделенным кодом,
в том числе с использованием внешних программ

Не знаю, как это сделать. Плагин?

--- отладка ---
Уровни поддержки:
1) Есть некий отладчик (подробнее?)
2) Интеграция с браузерами (Firefox, Internet Explorer)
Да, Run Configuration->Javascript debugging, ставит расширение для Firefox

--- операционные системы ---
Кроссплатформенный, Java

--- стоимость ---
WebIDE пока что в pre-alpha, но люди его используют.
Intellij IDEA платная, 599$

Dmitry A. Soshnikov,
можно попросить переделать пост под структуру? Я из этого таблицу сделаю потом..

Илья Кантор,
я вчера еще обнаружил, что WebIDE умеет синтаксическое дерево показывать.

Редактор EmEditor (Emurasoft)

http://emeditor.com

--- автокомплит ---
Уровни поддержки:
1) по символам в файле
да

2) учет прототипа/структуры объекта
да (просто в автокомплите выводит все символы в файле, включая свойство из прототипа)

3) учет других javascript-файлов проекта
нет

4) получение информации о типе из специальных
комментариев (ScriptDoc, Intellisense и т.п.))
нет/не знаю

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

--- фолдинг(сворачивание участков кода) ---
Уровни поддержки:
1) на уровне функций
2) ур. 1 + на уровне блоков
3) ур. 2 + на уровне комментариев

Да, ур. 3

--- подсветка и анализ синтаксического дерева --
Уровни поддержки:
1) Есть в файлах .js + проверка синтаксиса
2) Правильно интегрировано с HTML/шаблонами, учтена проверка синтаксиса

Да (подсветка, правильно интегрированная с HTML; проверки синтаксиса нет, возможно, дополнительными плагинами - не знаю)

--- быстрота ---
Уровень оценивается субъективно, оценкой от 1 до 10

1) Скорость запуска 1
2) Дальнейшая работа 1


Очень легковесный, большие файлы открывает тоже быстро.

--- структура кода ---
Уровни поддержки:
1) Возможность перейти к определению переменной/функции(go to definition)
да (при использовании проекта и его таблицы символов, либо при включённом outline-е и его таблицы; отдельно, либо по shorcut-у - нет, хотя, возможно, легко скриптуется макросами).

2) Возможность переименовать везде (рефакторинг)
нет (не выделено специальной функции, но - Ctrl-H, "заменить всё" :) + "заменить всё во всех файлах")

3) Возможность просмотра и навигации по коду, используя структуру (outline)
да

--- сниппеты ---


Уровни поддержки:
1) Вставка куска кода по хоткею
2) Вставка сниппета на основе выделенного блока кода.
Например: обрамление комментариями, окружение if, try..catch
3) Вставка сниппетов по шаблону, например: f( разворачивается в function()

1,2,3) да

--- кастомизация ---
Уровни поддержки:
1) Можно добавить (заскриптовать) какие-то действия с выделенным кодом,
в том числе с использованием внешних программ

Да (хорошая поддержка макросов: скриптуется либо JS, либо VB + автоматическая генерация кода по записи действий). Кастомные сниппеты/макросы, скриптование выделенного текста (например, обрамление, сортировка и т.д.), передача его внешней программе.

--- отладка ---
Уровни поддержки:
1) Есть некий отладчик (подробнее?)
2) Интеграция с браузерами (Firefox, Internet Explorer)
Нет (возможно, дополнительным плагином). Есть встроенный браузер (Web Preview - панель в которой можно смотреть результат; не пользуюсь).

--- операционные системы ---
Windows

--- стоимость ---
$39.99

Также (не пользуюсь этим):

* понимает CSV, TSV, User defined DSV;
* линейка есть :D
* Web Preview
* HTML Bar (теги, формы, таблицы, выбор цвета и т.д.);
* Diff
* Explorer файлов
* Расширенный search bar
* Word Count
* External Tools (IE, CMD, любая другая)
* Вывод во встроенную консоль результатов внешней программы.

Komodo IDE

--- автокомплит ---
Уровни поддержки:
1) по символам в файле
Да

2) учет прототипа/структуры объекта
Да

3) учет других javascript-файлов проекта
Да

4) получение информации о типе из специальных комментариев (ScriptDoc, Intellisense и т.п.))
Да, но не знаю как заюзать, точнее как написать свое.

5) поддержка основных javascript-фреймворков
Да


--- фолдинг(сворачивание участков кода) ---
Уровни поддержки:
1) на уровне функций
Да

2) ур. 1 + на уровне блоков
Да

3) ур. 2 + на уровне комментариев
Нет

--- подсветка и анализ синтаксического дерева --
Уровни поддержки:
1) Есть в файлах .js + проверка синтаксиса
Да, причем даже строгая, типа функция не возвращает данные.

2) Правильно интегрировано с HTML/шаблонами, учтена проверка синтаксиса
Да

--- быстрота ---
Уровень оценивается субъективно, оценкой от 1(медленнее некуда) до 10 (летает).
1) Скорость запуска
3 5-10 сек. Nuspere PHP гдето 3-6сек

2) Дальнейшая работа
5

--- структура кода ---
Уровни поддержки:
1) Возможность перейти к определению переменной/функции(go to definition)
Да, ctrl+click

2) Возможность переименовать везде (рефакторинг)
Быстрого способа нет, поиск по файлам.

3) Возможность просмотра и навигации по коду, используя структуру (outline)
Да, структура, DOM

--- сниппеты ---
Уровни поддержки:
1) Вставка куска кода по хоткею
2) Вставка сниппета на основе выделенного блока кода.
Например: обрамление комментариями, окружение if, try..catch
3) Вставка сниппетов по шаблону, например: f( разворачивается в function()
Есть


--- кастомизация ---
Уровни поддержки:
1) Можно добавить (заскриптовать) какие-то действия с выделенным кодом,
более умные, чем шаблон, например, с использованием внешних программ
Незнаю

--- отладка ---
Уровни поддержки:
1) Есть некий отладчик (подробнее?)
2) Интеграция с браузерами (Firefox, Internet Explorer)
Вроде есть, но я не пользуюсь

--- операционные системы ---
Windows, Linux, Mac support ?
Все перечисленные

--- стоимость ---
Komodo IDE is $295 USD for all the languages, platforms, and systems you use. Licenses include all point release updates (such as from Komodo IDE 5.2 to 5.3).

Komodo IDE team pricing: Get 5 licenses for the price of 4 when you buy a 5-pack for $1180 USD.
Но это все фигня =)

Я, вот когда говорил в соседней теме, что некоторые редакторы иногда не понимают, что они проверяют, как раз имел в виду Komodo. Коллеги на работе используют Komodo, и этот редактор ругался на мой код: было два return-a:

if (!условие) {
  return;
}

// обработка

return какойТоОбъект;

Так вот Komodo у коллег ругался на первый return, говоря, что он, якобы, не возвращает значение (ну, правильно, Komodo же (а вернее, тот, кто писал алгоритм этой проверки) не знал, что функция в JS всегда возвращает значение, даже если вообще нет return-a, либо же, ему невдомёк, что возвращается дефолтное undefined). В общем, коллегам не нравилась красная подчёркивающая линия, сигнализирующая об ошибке и решили поставить return null; ;) И невдомёк Komodo, что этот return - это просто "выход из анализа", т.е. значение вообще не интересует: код в самом начале не прошёл проверку - выходим, нет смысла анализировать дальше.

Ctrl+T

В JS, например, набери func и нажми Ctrl+T.

Вообще, Komodo - хороший редактор/IDE (UI написан на XUL-e, легко писать плагины, макросы скриптуются JS или Python-ом), но, по сравнению с EmEditor - тормозной.

Еще по Komodo: у меня он не умеет автокомплит с учетом структуры, смотрите например пример

function MyClass() {
this.method = function() {}
}
MyClass.prototype.protoMethod = function() {}

function blabla() {}

myVar = new MyClass()

myVar.... автокомплит

он, случаем, не предлагает blabla как вариант?

это отключается.

Выдает протометод а вот метод не видит =( эт его недостаток. он видит ток прямые прототипы функций-переменных как я понял
А что у вас видит другие при такой раскладке?

F = function(){
this.c=1;
}

F.prototype.a = function(){}
F.prototype.b = function(){}

FF = function(){return new F();}

FF... автокоплит что выдает? в комодо все a,b,c

П.С. EmEditor не поддерживает проекты, а это никуда не годится. Ну хоть файловая система есть. Для меня это как блокнот не больше.

F = function(){
this.c=1;
}
 
F.prototype.a = function(){}
F.prototype.b = function(){}

 
FF = new F()

Все видит ок 5.2

А зеленая линия реально напрягает warning

function blabla() {
    return;
    
    return 5; // приходится warning отключать
}

Edit-Preferences-Language-Javascript-галка Enable Strict warnings снять

П.С. Кантор помоги в личку где скачать WebIDE и немного для старта помощи по настройкам? хочу испытать раз говоришь он понимает мою конструкцию...

Пожалуйста, указывайте не только что возможность есть, но и КАК ее задействовать.
Многие пользуются редакторами и IDE, не зная всех их возможностей.


Например, использование типа JSdoc в Komodo:

/**
 * func
 * @param {Node} node
 */
function func(node) {
   node. --- автокомплит будет для DOM Node
}

что видит при FF()... автокомплит?

a,b,c

WebIDE доступен в http://www.jetbrains.com/webide/download/

Поддерживает. И solution-ы, и project-ы. Но я не пользуюсь.

Это редактор, не IDE. И вполне хороший редактор. Если можно сравнить с блокнотом, то только в легковесности и быстроте запуска/работы ;)

EmEditor тоже не умеет - blabla будет показано в автокомплите (т.е. все символы в документе).

Вот если бы еще в WebIDE понимал не только тип агргументов функции но и их описание выводилось было бы супер, а пока сижу на Komodo, он хоть описание выводить умеет. а это не мало важно, если функция использует разные хитрости. Пример:

/**
 * Выполненние функции для каждого потомка элемента
 * @param {function} fn Функция. В ней: элемент=this, передаются элемент[потомок],потомок. При возврате: true|false - фильтрация элементов. null-прерывание обработки цепочки, !==undefined - новый результат.
 * @return this
 */

Так вот тип переменной видит а вот дальше описание для чего переменная не показывает. как его заставить показывать?

П.С. Комодо не умеет выводить описание каждой переменной по отдельности, но я заменяю @ на # и описание выводится всем текстом.

Ctrl+Q на имени функции.

так это уже лучше. а вот как заставить этот webIDE переводить принудительно строку в описании? ничего не помогает ставлю и wind и unix кодировку и мак пофиг все строчит в 1 строку. пример:

/**
 * описание
 * описание2
 * @param a описание параметра А
 * продолжение на новой строке
 * @param b описание параметра Б
 * продолжение для параметра Б на новой строке
 */
function abc(a,b) {}

abc();

ctrl+Q на функции и для каждого параметра все в 1 строку. а вот общее описание видит нормально...
вставление более <br> на каждой строке тоже не помогает, опять же помогает если все написано в 1 строку...

PeaceCoder,
вы wordwrap имеете в виду? Они это пока не реализовали.

нет. именно принудительный перенос строки в описании параметра функции.
вставьет этот кусок кода и попробуйте получить описание перемнной. увидите все написано в 1 строку а не так как я написал. новая строка позволяет описать параметры обьекта например, как у мена описано:

/**
 * Привязывание обьекта-подсказки к элементу.
 * #param {object} params Параметры создания. При params=FALSE|NULL - убирается подсказка
 *   {string|HTML Element} [content] Содержимое подсказки
 *   {int} [rX]=10,[rY]=10 Радиус отступа от мыши/элемента
 *   {int} [width]=auto,[height]=auto Высота и ширина подсказки
 *   {string} [overflow]='auto' Стиль overflow содержимого
 *   {bool} [resize]=false Возможность изменять размеры?
 *   {bool} [drag]=false Возможность перетаскивания
 *   {int|string} [show]=1000 Метод показа. INT: Через (мс) после навода курсора, STRING: 'focus','click'
 *   {string} [showType]=opacity|quick Вид показа.
 *   {function} [onShow] Вызываемая функция перед показом. В ней: this=params, Передается TOOLTIP Element
 *   {int|string} [hide]=200 Метод скрытия. INT: Через (мс) после отвода курсора от вызвавшего эл., STRING: 'blur','mousedown','mouseup','click'
 *   {string} [hideType]=opacity|quick Вид скрытия.
 *   {string} [pos]='LRTB' Зоны разрешенного показа относительно курсора/элемента
 *   {int} [cX],[cY] Центрирование и обтекание по элементу. См. F_ELEMENT.putNear()
 *   {int} [dX]=0.5, [dY]=0.5 Желательный центр по краям подсказки. См. F_ELEMENT.putNear()
 * #return this
 */

Тут я показываю возможные варианта данных + то что они могут быть по у молчанию и не обязательны.
если заменить # на @ и получить описание будет весело =)

WebIDE тупо не парсит такой формат и выводит как есть, считая все описанием функции, а не описанием параметров.

От такой замены в данном случае комментарий JSDoc'ом не станет.

а правильнее было бы понимать этот текст как он есть: пробелы не сжимать и принудительные переводы показывать так же как написано пока не встретишь конец или новый @. По крайней мере в Nuspere PHPEd так. ток он на JS не расчитан, а жаль =(
Знаю. Но при кодинге полезно почитать описание, если долго не юзал функцию... И вот если будет @ то и почитать не получится. а так все норм. А при JSDoc'е можно и позаменять # на @

Принудительные переводы показывать неправильно, т.к. их ставят для того, чтобы в коде за экран строка не уходила, а не чтобы в документации переводы были. И вообще там HTML со всеми вытекающими.

Кто ж спорит-то? Пользуйтесь общепринятыми форматами документации.

wordwrap? нэ? А вообще это можно сделать настройкой...
угу. <br> работает но только если они написаны в одну строку... противоречивость твоим словам... если писать <br> на каждой строке то работает только первый... остальные не распознаются - можно сказать баГ?

Нэ.

Ты сначала нормальный JSDoc напиши, а потом претензии предъявляй.

Может и баг, это alpha-версия.

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

И это альфа :)

угу заметил что ооочень жрет много памяти на жестком... бывает 3гб раз и нету... вот это баг. обычно связано если файл тяжелый.

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

а вы пробовали php отлаживать из WebIDE, т.е. запускать сессию из браузера?

Использую NetBeans (собстно универсально и бесплатно) для написания и анализа кода, что приятно парсит в одном файле и php и js и html при этом подсветка и атодополнение вполне корректно работает!
но вот не смог прикрутить нормально к файерфоксу отладчик js ... вот еще бы и php не получилось. :(
для php отладки изпользую PhpEd - отладка на уровне.
а js отлаживаю фаербагом..
если кто по нетбинс подскажет, как правильно интегрировать отладчики - буду благодарен

Незнаю баг это или специально так задумано.
Пользуюсь PhpStorm(WebIDE). Проблема в седующем. У его очень мощная система фолдинга. Так вот. Когда сворачиваю многие части кода, и продолжаю редактировать чтото, то редактор автоматом разворачивает куски кода, причем не частями а всразу все.

Может кто знает настройку или что нибудь еще, что бы редактор не разворачивал код, пока пользователь сам принудительно не даст команду развернуть?

П.С. Изза этого меня этот редактор немного уже бесит, думал перейти на netBeans но там возможностей раза 2 меньше.
Еще проблема. Что надо сделать что бы он не лагал так сильно?
Проц: 2ггц. память 1.5гб. видео Geforce 6600GT 128мб. Кеш 2-4гб

ап

Я навичок пользуюсь Notepad++ - очень удобно и практично. Есть подсветка кода, подсказки по коду.
Выбор с какой библиотекой подсказок работать (html, javascript, css) при раздельном коде. В каком браузере интерпритировать. В принципе не жалуюсь.
netBeans тоже не плох - более профисионален.
Ну и FireBag !!!

Недавно приобрел PhpStorm, могу сказать что это очень мощный и полезный инструмент для разработки серверных приложений на поддерживаемых им языках, но для того же JS я его не использую т.к. не могу смириться с перегруженным интерфейсом и чрезмерным потреблением памяти. N++ пока для меня лучший друг.

Прошу прощения за ламерский вопрос: а есть возможность дебагироваться не в брузере? например, запуская скрипт под SpiderMonkey?
вообще, бывают такие дебаггеры? Или я "хочу странного"?

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

p.s. дебагироваться отлаживать