2010-09-14 6 views
6

Что было бы лучшим способом абстрагироваться от какой-либо конкретной инфраструктуры JavaScript (jQuery, MooTools и т. Д.), Которая находится в нижней части стека фреймов? По сути, я хотел бы иметь ситуацию, когда я мог бы поменять библиотеку, внести изменения только в один слой фреймворка (не для каждого модуля, например), и все это может снова и снова запускаться.Лучший способ абстрагироваться от библиотеки JavaScript?

Итак, каждый модуль должен вызывать функцию (-ы) фрейма, которая затем будет перенаправлена ​​в библиотеку.

+2

Кажется, что ваша библиотека будет очень большой – epascarello

ответ

9

Возможно, вы захотите использовать что-то вроде Adapter Pattern. Создайте свой собственный интерфейс, раскрыв методы, которые вы будете использовать в своем приложении, а затем создайте адаптер для каждого инструментария, который вы хотели бы поддержать (jQuery, MooTools, YUI и т. Д.). Затем ваш собственный интерфейс будет маршрутизировать вызовы метода к конкретным адаптерам.

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

Это что-то, что в настоящее время делает Ext JS. Вы можете выбрать, какой адаптер использовать (jQuery, YUI и т. Д.) За вызовами метода. Например: Ext.getCmp() будет использовать jQuery.$() при использовании адаптера jQuery. Однако это часто не очень простое сопоставление «один-к-одному».

Ext JS начал свою жизнь как расширение библиотеки javascript Yahoo UI. В то время Ext использовал YUI для всего своего кросс-браузерного кода низкого уровня. Теперь, когда Ext является автономной библиотекой JavaScript, у вас есть выбор подменять YUI для других библиотек JavaScript, таких как Prototype или jQuery. Исходные файлы, отображающие низкоуровневый Ext API в других библиотеках JavaScript (или собственной базовой библиотеке Ext), называются адаптерами, и они живут в подкаталоге source/adapter. Когда вы добавляете Ext на свой сайт, вы выбираете, какой адаптер вы хотите использовать.

От: Ext JS Manual: Source Overview

+0

Как бы это действительно работало? Учитывая, что в структурах есть другой набор методов и способностей, как бы вы пишете один всеобъемлющий супер набор методов? Похоже, вам нужно заполнить пробелы, каждая функция, которую есть в одной библиотеке, другая не ... вам нужно добавить функциональность там, где она отсутствует. –

+0

@ Ник: Да, ты прав. Я не говорю, что это легко ... Это то, что делает ExtJS. Это требует, чтобы вы выбрали адаптер. Первоначально он поддерживал YUI, jQuery, Prototype IIRC, но затем они также реализовали свой собственный адаптер. Хорошо, что если вы используете свой собственный адаптер, но тогда вы хотите использовать что-то, что зависит от jQuery, вы можете просто переключить адаптер. Очень аккуратно, но определенно непросто реализовать. –

+0

+1 Даниэль просто избил меня;) – BGerrissen

6

Это будет писать библиотеку для ... библиотек, если вас беспокоит производительность вообще (и почему не будет?), Вы должны пойти по другому пути в целом. Еще один абстракционный слой поверх библиотек с очень разными подходами (особенно когда вы попадаете в утилиты, анимации и т. Д.) Было бы очень плохо и неэффективным и трудоемким.

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

+0

@nick, есть глубокая разница между наборами инструментов/библиотек и фреймворками. Рамки создаются поверх наборов инструментов и библиотек. jQuery и Prototype - это не что иное, как набор инструментов, Dojo, Yui и почти каркасы, а ExtJS можно назвать фреймворком. – BGerrissen

+0

@BGerrissen - Это зависит от вашего определения. Я полагаю, с добавлением jQuery + jQuery UI, как вы называете это набором инструментов и YUI каркасом? Я думаю, что в лучшем случае это серая область, это действительно вопрос о главных плагинах и где вес - ИМО. –

+0

Я действительно обеспокоен производительностью, поскольку большая часть этого будет выполняться на мобильных устройствах. Тем не менее, я стараюсь кэшировать ад из запросов библиотеки, так что структура может иметь прямую ссылку на функции внутри библиотеки, так что запрос не должен перемещаться каждый раз через каждый уровень. – crappish

2

Это может быть разумная идея, если рамки имели эквивалентные функциональные возможности. К сожалению, они этого не делают; они делают разные вещи, и они делают их по-другому. Между ними есть перекресток, но ваша обложка пропустила бы много, потому что вы могли бы только сделать свою упаковку на вещи, которые были в обоих. У вас будет самый низкий общий знаменатель; худшее из обоих миров.

Мой совет - потратить время на изучение обеих библиотек - MooTools и JQuery - очень хорошие библиотеки, и хорошо знать их обоих. Даже если вы используете только один из них в своем проекте, вы, по крайней мере, сможете сделать осознанный выбор перед началом работы.

+0

Это НЕ верно. Существуют различные способы «заполнить пробелы», которые могут иметься. В какой-то момент вы можете применить интерфейс проприетарного расширения, в другом случае базовая библиотека может покрыть это. Это всего лишь один пример. В конце концов, Coupling вызывает все виды головных болей, с которыми вы не хотите иметь дело. – Cody

3

Вам нужно будет написать адаптеры для каждого инструментария/библиотеки, которые вы, возможно, захотите использовать для своей структуры, в значительной степени похожа на ExtJS/Sencha (хотя их, вероятно, не многоразовые).

Начните с определения того, какие методы должен иметь ваш адаптер, он будет действовать как ваш API-интерфейсы с низким уровнем API.

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

Добавить новый инструментарий/библиотеку, написать новый адаптер в соответствии с вашим сопоставлением.

Смежные вопросы