Angularjs 轻量版
Angularjs Light version
我在很多项目中使用 angular,特别是在 ASP.NET MVC 中,但我不喜欢 angular-
- 路由器(也是 ui-路由器,这确实不是什么大问题,因为它只是一个插件)- 网络应用程序的概念扼杀了所有 ASP.NET 功能
- 服务和工厂——因为所有这些都可以在公共控制器内完成。 (这听起来可能很棘手)
- 常量和值——因为我认为如果你使用 requirejs 或其他 AMD
,这并不是真正需要的
我喜欢 angular 的只是指令,当我制作大的嵌套指令时,我使用相同的控制器 foreach,所以没有 $scope
交互(较少观察者)
.controller('BaseGridCtrl', function(){
//instead of
//$scope.value = 123;
var ctrl = this;
//this is for Table-base-directive
ctrl.value = 123;
//this is for Table-head-directive
ctrl.value2 = 123;
});
.directive('table-base', function(){
return {
template: '<div>{{bgc.value}}</div>',
controller: 'BaseGridCtrl',
controllerAs: 'bgc'
}
});
.directive('table-head', function(){
return {
template: '<div>{{bgc.value2}}</div>',
controller: 'BaseGridCtrl',
controllerAs: 'bgc'
}
});
.directive('table-foot', function(){
return {
template: '<div>{{bgc.value3}}</div>',
controllerAs: 'bgc',
controller: function(){
var ctrl = this;
ctrl.value3 = 123;
}
}
});
所以link函数用得很少。特别是我喜欢 angular 轻松检测指令 - 这很棒,因为您只需编写 1 个标签 <grid>
而不是 reactjs 组件(这听起来也很棘手)。在我的项目中,我使用 DotLiquid 作为剃刀视图(它作为字符串存储在数据库中)示例:
<grid theme="some" route="localhost:9000/some/action"></grid>
所以 dotLiquid 只是呈现这个字符串 w/o 问题,甚至在 angularjs 旁边应用其他 bingings。这很棒,因为所有东西都是独立的。 reactjs 无法实现 - 你需要自己 bootstrap 组件
React.renderComponent(<Grid />, document.querySelector('#someId'))
继续
目前它很重,大约 100kb,但如果没有所有这些不必要的东西,它会非常轻。我想只使用 directive
和 controller
服务,而且服务器端渲染 angular 会在每个请求上使用 bootstrap 本身,这是不明智的,但它是较轻的版本有点权衡。
有人试过成功剥离 angular 服务吗?或者有什么考虑,有什么想法吗?
编辑
Angular-light 看起来很有希望,但是:
- 它不提供 HTML 标签检测,只提供属性
- 真的很难看,
alight.directives.al.getValue
这只对我或其他人来说太糟糕了?
edit2
好吧,那 100kb 可能玩不了多少。但将其视为锻炼,如您所知,angular 仅在页面加载时启动一次,因此它必须构建 uild 应用程序,拉取所有模块,配置每个模块,然后配置模块的所有服务,然后将它们注入到需要的地方,然后向任何注入它们的人提供来自工厂和服务的回调,至少它会检查是否存在(在每个模块上),所有这些都在开始时发生,只有一次!通过清除大小,我们还可以最小化 javascript 执行(确实会)、工厂和服务观察者,因此我们不需要任何未使用的部分。我们甚至可以摆脱控制器(并内联使用它们),只有一项服务。 angular.directive
(这是派对的最佳部分)。看过小胡子、车把,但它们就像 reactjs 一样。
你可以尝试 Angular Light ~15kb (gzipped),它没有服务、工厂、常量、值、DI、路由器等。
此外,它还有一些有用的功能,例如文本指令和 Object.observe (benchmark)
的支持
编辑
它提供HTML标签检测、属性和注释。
AngularJS 用于完整的 SPA 开发。这意味着您 而不是 一直往返于服务器。如果您的应用程序需要来回传递数据,请使用 WEB API 控制器并将 JSON 传递给它们。
我目前正在开发的资产管理系统是带有 WEB API 的完整 SPA,并且 MVC 完全包含在它的需求中。用户登录在整个页面请求中处理,其他一切都是 SPA。此外,这里有一些关于一起使用 MVC/WebAPI and Angular 的更多信息。
如果您尝试使用 AngularJS 而不是 BackboneJS then you should be using AngularJS Light which was started for this exact purpose. I haven't used this library specifically, but as it is suppose to be an alternative to libraries I do use. The suggestion, if you want Angular and not BackboneJS or KnockoutJS use AngularJS Light
我在很多项目中使用 angular,特别是在 ASP.NET MVC 中,但我不喜欢 angular-
- 路由器(也是 ui-路由器,这确实不是什么大问题,因为它只是一个插件)- 网络应用程序的概念扼杀了所有 ASP.NET 功能
- 服务和工厂——因为所有这些都可以在公共控制器内完成。 (这听起来可能很棘手)
- 常量和值——因为我认为如果你使用 requirejs 或其他 AMD ,这并不是真正需要的
我喜欢 angular 的只是指令,当我制作大的嵌套指令时,我使用相同的控制器 foreach,所以没有 $scope
交互(较少观察者)
.controller('BaseGridCtrl', function(){
//instead of
//$scope.value = 123;
var ctrl = this;
//this is for Table-base-directive
ctrl.value = 123;
//this is for Table-head-directive
ctrl.value2 = 123;
});
.directive('table-base', function(){
return {
template: '<div>{{bgc.value}}</div>',
controller: 'BaseGridCtrl',
controllerAs: 'bgc'
}
});
.directive('table-head', function(){
return {
template: '<div>{{bgc.value2}}</div>',
controller: 'BaseGridCtrl',
controllerAs: 'bgc'
}
});
.directive('table-foot', function(){
return {
template: '<div>{{bgc.value3}}</div>',
controllerAs: 'bgc',
controller: function(){
var ctrl = this;
ctrl.value3 = 123;
}
}
});
所以link函数用得很少。特别是我喜欢 angular 轻松检测指令 - 这很棒,因为您只需编写 1 个标签 <grid>
而不是 reactjs 组件(这听起来也很棘手)。在我的项目中,我使用 DotLiquid 作为剃刀视图(它作为字符串存储在数据库中)示例:
<grid theme="some" route="localhost:9000/some/action"></grid>
所以 dotLiquid 只是呈现这个字符串 w/o 问题,甚至在 angularjs 旁边应用其他 bingings。这很棒,因为所有东西都是独立的。 reactjs 无法实现 - 你需要自己 bootstrap 组件
React.renderComponent(<Grid />, document.querySelector('#someId'))
继续
目前它很重,大约 100kb,但如果没有所有这些不必要的东西,它会非常轻。我想只使用 directive
和 controller
服务,而且服务器端渲染 angular 会在每个请求上使用 bootstrap 本身,这是不明智的,但它是较轻的版本有点权衡。
有人试过成功剥离 angular 服务吗?或者有什么考虑,有什么想法吗?
编辑
Angular-light 看起来很有希望,但是:
- 它不提供 HTML 标签检测,只提供属性
- 真的很难看,
alight.directives.al.getValue
这只对我或其他人来说太糟糕了?
edit2
好吧,那 100kb 可能玩不了多少。但将其视为锻炼,如您所知,angular 仅在页面加载时启动一次,因此它必须构建 uild 应用程序,拉取所有模块,配置每个模块,然后配置模块的所有服务,然后将它们注入到需要的地方,然后向任何注入它们的人提供来自工厂和服务的回调,至少它会检查是否存在(在每个模块上),所有这些都在开始时发生,只有一次!通过清除大小,我们还可以最小化 javascript 执行(确实会)、工厂和服务观察者,因此我们不需要任何未使用的部分。我们甚至可以摆脱控制器(并内联使用它们),只有一项服务。 angular.directive
(这是派对的最佳部分)。看过小胡子、车把,但它们就像 reactjs 一样。
你可以尝试 Angular Light ~15kb (gzipped),它没有服务、工厂、常量、值、DI、路由器等。
此外,它还有一些有用的功能,例如文本指令和 Object.observe (benchmark)
的支持编辑
它提供HTML标签检测、属性和注释。
AngularJS 用于完整的 SPA 开发。这意味着您 而不是 一直往返于服务器。如果您的应用程序需要来回传递数据,请使用 WEB API 控制器并将 JSON 传递给它们。
我目前正在开发的资产管理系统是带有 WEB API 的完整 SPA,并且 MVC 完全包含在它的需求中。用户登录在整个页面请求中处理,其他一切都是 SPA。此外,这里有一些关于一起使用 MVC/WebAPI and Angular 的更多信息。
如果您尝试使用 AngularJS 而不是 BackboneJS then you should be using AngularJS Light which was started for this exact purpose. I haven't used this library specifically, but as it is suppose to be an alternative to libraries I do use. The suggestion, if you want Angular and not BackboneJS or KnockoutJS use AngularJS Light