标签: templating

为什么我不用Javascript和Javascript HTML模板构建整个Web应用程序?

我在应用程序中找到了我需要开始缓存的东西,它让我思考......

  1. 在应用程序的某些部分,我通过抓取纯JSON并通过像Mustache,jquery.tmpl等运行它来呈现表行(jqGrid,slickgrid等)或花式div行(如在新推特中).
  2. 在应用程序的其他部分,我只是在纯HTML(服务器端HAML模板)中呈现信息,如果有搜索/分页,我只是转到一个新的URL并加载一个新的HTML页面.

现在的问题在于缓存和可维护性.

一方面我在想,如果一切都是使用Javascript HTML模板构建的,那么我的应用程序只提供HTML布局/ shell和一堆JSON.如果你看看Facebook和Twitter HTML源代码,那基本上就是他们正在做的事情(95%json/javascript,5%html).这将使我的应用程序只需要缓存JSON(页面,操作和/或记录).这意味着无论你是一些远程api开发人员访问JSON api还是海峡网络应用程序,你都会点击缓存.也就是说,我不需要2个缓存,一个用于JSON,一个用于HTML.这似乎将我的缓存存储减少了一半,并简化了一些事情.

另一方面,我正在思考,从我所看到/经历过的,生成静态HTML服务器端,以及缓存,似乎是更好的性能明智的跨浏览器; 你可以立即获得图形,而不必等待javascript渲染它.StackOverflow似乎用普通的HTML做所有事情,Google也是如此,你可以告诉......一切都出现了.请注意,如果在twitter.com上,该页面为.5-1秒是空白的,并且页面块中包含:javascript必须呈现json.这样的缺点是,对于任何动态(如无限滚动或网格),我必须创建javascript模板...所以现在我有服务器端HAML模板,客户端javascript模板,以及很多更多缓存.

我的问题是,对于如何处理这个问题有什么共识吗?您将两者混合在100%与另一种混合的经验中有什么好处和缺点?

更新:

导致我尚未决定使用100%javascript模板的原因有以下几个原因:

  • 表现.还没有正式测试过,但从我看到的情况来看,原始html比javascript生成的html跨浏览器更快,更流畅.另外,我不确定移动设备如何处理动态html性能.
  • 测试.我有很多集成测试可以很好地与静态HTML一起使用,因此切换到仅javascript需要1)更集中的纯javascript测试(jasmine),以及2)将javascript集成到capybara集成测试中.这只是时间和工作的问题,但它可能很重要.
  • 维护.摆脱HAML.我喜欢HAML,编写起来非常简单,打印漂亮的HTML ......它使代码干净,使维护变得简单.使用javascript,没有什么是简洁的.
  • SEO.我知道谷歌处理ajax /#!/path,但还没有意识到这将如何影响其他搜索引擎以及旧浏览器如何处理它.好像它需要一个重要的设置.

html javascript performance json templating

18
推荐指数
2
解决办法
3371
查看次数

Backbone.js:通过模板嵌套视图

在技​​术上是否可以使用模板嵌套视图,类似于:

<%= new PhotoCollectionView({model:new PhotoCollection(model.similarPhotos)}).render().el) %>
Run Code Online (Sandbox Code Playgroud)

我也可以将所有内容都放在渲染方法中,但模板为灵活性和布局提供了更多空间.

我尝试了前面提到的变体,但我在屏幕上得到的结果是[HTMLDivElement].

如果我尝试只提取HTML,使用jQuery的HTML,我会将其渲染,但事实证明,打印出来的DOM节点与视图引用的DOM节点不同,因为没有任何交互使用视图实例可以使用这些DOM节点.例如,如果在视图中我说$(this.el).hide(),什么都不会发生.

什么是正确的方法,如果有的话?

javascript jquery templating backbone.js

18
推荐指数
2
解决办法
1万
查看次数

Helm 模板:获取第一个数组元素的节点

说我有这些价值观

grafana:
  ...
  ingress:
    enabled: true
    annotations: {}
      # kubernetes.io/ingress.class: nginx
      # kubernetes.io/tls-acme: "true"
    hosts:
      - host: chart-example.local
        paths: ["/grafana"]
Run Code Online (Sandbox Code Playgroud)

这是标准的头盔。出于这个原因,我想保留hosts为一个数组(即使它使接下来的移动有点棘手)。我怎样才能获得第一个.host(我不介意任何可能的其他)才能使env.value动态

      containers:
        - name: {{ .Chart.Name }}-grafana
          env:
          - name: GF_DOMAIN
            value: chart-example.local
Run Code Online (Sandbox Code Playgroud)

我试过

          env:
          - name: GF_DOMAIN
          {{- range .Values.grafana.ingress.hosts }}
            value: {{ .host }}
          {{- end }}
Run Code Online (Sandbox Code Playgroud)
          env:
          {{- range .Values.grafana.ingress.hosts }}
          - name: GF_DOMAIN
            value: {{ .host }}
          {{- end }}
Run Code Online (Sandbox Code Playgroud)

按照这个建议,我也尝试过

          env:
          {{- with .Values.grafana.ingress.hosts 0}} …
Run Code Online (Sandbox Code Playgroud)

yaml templating go-templates kubernetes-helm

18
推荐指数
1
解决办法
2万
查看次数

在没有Rails的Ruby中进行部分HAML模板化

对于我的小项目,我真的不需要Rails的开销,所以我只想使用普通的Ruby和HAML来实现这一点.

我想在我的HAML模板中包含另一个HAML文件.但我还没有找到一种好的或实用的方法.

例如,我有这两个HAML文件:

documents.haml

%html
 %body
  = include(menu.haml) body
  %article …
Run Code Online (Sandbox Code Playgroud)

menu.haml

%ul
 %li
  %a whatever …
Run Code Online (Sandbox Code Playgroud)

包括显然不是去这里的方式.但它描述了我在这个例子中想要实现的目标.

ruby haml templating

17
推荐指数
2
解决办法
1万
查看次数

流星:什么是测试Blaze中两个值(如{{#if someVar =='someVal'}})相等的最佳方法?

我不得不在任何地方定义模板助手,只是用常量测试文档属性的相等性,所以我可以在我的模板中做这样的事情:

    {{#if fruitIsPineapple}}...{{/if}}
Run Code Online (Sandbox Code Playgroud)

在我的模板中,助手看起来像:

    Template.example.helpers({
      fruitIsPineapple: function () { return this.document.fruit === 'pineapple'; } 
    });
Run Code Online (Sandbox Code Playgroud)

如何避免创建所有这些助手?如果我们在Blaze中有一个相等运算符,那就太好了......

javascript templating meteor

17
推荐指数
2
解决办法
1万
查看次数

胡子斯卡拉特与胡子Java

我需要为我的Scala项目选择一个Mustache渲染引擎.似乎只有两个选择是Mustache-Java和Scalate?有比较吗?两者中哪一个更稳定/更高效?

java scala templating mustache scalate

16
推荐指数
2
解决办法
2224
查看次数

Silverlight中的条件样式?

虽然我对Silverlight中的标准控件样式很好,但我最近开始使用更多动态方法来获取要在项目控件中显示的数据.我正在重做的控件之一是链接集合.

我遇到的问题是,当鼠标悬停时,每个链接的颜色都不同.一个红色,一个蓝色,一个绿色等.有没有一种方法来设置这些项目的样式而不牺牲使用数据模板的项目控件的动态?

c# silverlight controls templating

15
推荐指数
1
解决办法
3625
查看次数

hogan.js没有维护吗?使用安全吗?

我已经看到Twitter的hogan.js没有取得进展,而且有点放弃了(github:https://github.com/twitter/hogan.js).问题没有出席,NPM的最后一个版本是2.0.0(https://www.npmjs.org/package/hogan.js),而在github中已经是3.0.0了.八个月前,它被要求在NPM中更新,但尚未完成(https://github.com/twitter/hogan.js/issues/111).

Twitter仍在使用Mustache模板吗?为什么这个项目如此无人值守?你会用它作为现实生活中的产品吗?

twitter templating mustache hogan.js

15
推荐指数
0
解决办法
1351
查看次数

超薄模板:是否可以将两个元素放在同一条线上?

我经常想要嵌套元素,例如以下导航:

ul
  li
    a(href="#") link Name  
  li
    a(href="#") link Name 
  li
    a(href="#") link Name 
Run Code Online (Sandbox Code Playgroud)

有可能把李和一个放在同一条线上吗?一些语法li > a会很好.

ruby ruby-on-rails templating slim-lang

14
推荐指数
1
解决办法
2891
查看次数

Helm - values.yaml 中的模板变量

我正在尝试将 values.yaml 中地图中的变量模板化到我最终的 Kubernetes ConfigMap YAML 中。

我已经通读了https://github.com/helm/helm/issues/2492https://helm.sh/docs/chart_template_guide/但似乎找不到答案。

在某些情况下,这大致是我想要做的:

值.yaml

config:
  key1: value
  key2: value-{{ .Release.Name }}
Run Code Online (Sandbox Code Playgroud)

配置映射文件

kind: ConfigMap
data:
  config-file: |
    {{- range $key, $value := .Values.config }}
    {{ $key }} = {{ $value }}
    {{- end }}
Run Code Online (Sandbox Code Playgroud)

所需的输出是:

掌舵模板 --name v1 mychart/

kind: ConfigMap
data:
  config-file: |
    key1 = value
    key2 = value-v1
Run Code Online (Sandbox Code Playgroud)

我使用模板函数和流水线尝试了一些变体,但无济于事:

{{ $key }} = {{ tpl $value . }}
{{ $key }} = {{ $value | tpl . }} …
Run Code Online (Sandbox Code Playgroud)

templating kubernetes kubernetes-helm

14
推荐指数
4
解决办法
2万
查看次数