Menu

  • Home
  • Work
    • Cloud
      • Virtualization
      • IaaS
      • PaaS
    • Java
    • Go
    • C
    • C++
    • JavaScript
    • PHP
    • Python
    • Architecture
    • Others
      • Assembly
      • Ruby
      • Perl
      • Lua
      • Rust
      • XML
      • Network
      • IoT
      • GIS
      • Algorithm
      • AI
      • Math
      • RE
      • Graphic
    • OS
      • Linux
      • Windows
      • Mac OS X
    • BigData
    • Database
      • MySQL
      • Oracle
    • Mobile
      • Android
      • IOS
    • Web
      • HTML
      • CSS
  • Life
    • Cooking
    • Travel
    • Gardening
  • Gallery
  • Video
  • Music
  • Essay
  • Home
  • Work
    • Cloud
      • Virtualization
      • IaaS
      • PaaS
    • Java
    • Go
    • C
    • C++
    • JavaScript
    • PHP
    • Python
    • Architecture
    • Others
      • Assembly
      • Ruby
      • Perl
      • Lua
      • Rust
      • XML
      • Network
      • IoT
      • GIS
      • Algorithm
      • AI
      • Math
      • RE
      • Graphic
    • OS
      • Linux
      • Windows
      • Mac OS X
    • BigData
    • Database
      • MySQL
      • Oracle
    • Mobile
      • Android
      • IOS
    • Web
      • HTML
      • CSS
  • Life
    • Cooking
    • Travel
    • Gardening
  • Gallery
  • Video
  • Music
  • Essay

Framework7学习笔记(三):高级

16
Feb
2016

Framework7学习笔记(三):高级

By Alex
/ in HTML,JavaScript,Mobile
/ tags F7, 学习笔记
0 Comments
Template7

Template7是一个移动优先(mobile-first)的模板引擎,其使用Handlebars风格的语法。

T7非常轻量,速度很快。F7已经内置T7,无需包含额外的JS文件。T7也可以单独使用。

使用T7时,性能瓶颈会出现在编译阶段——把字符串编译为纯粹的JavaScript函数时,亦即调用 Template7.compile() 时。因此,不要编译同一个模板多次。

语法
变量
  1. {{title}}  输出当前上下文中title变量的值
  2. {{../title}} 输出父上下文中title变量的值
  3. {{../../title}} 输出父父上下文中title变量的值
  4. {{this}} 输出当前上下文对象
  5. {{person.name}}  输出当前上下文中person变量name属性的值
  6. {{../person.name}} 输出父上下文中person变量name属性的值
  7. {{@index}} 访问额外数据变量,这些数据变量可以在助手中访问
块表达式
  1. {{#helperName}} 块表达式开始
  2. {{/helperName}} 块表达式结束
  3. {{else}} 反转块表达式开始
  4. {{#helperName name="value"}} 块表达式开始,提供一个哈希参数(Hash argument),此参数的名/值分别为name/value
助手

举例: {{join myArray delimiter=", "}}  表示知晓join助手,传递上下文变量myArray以及哈希参数delimiter。

内置助手
{{#each}}...{{else}}...{{/each}}

用于遍历传入的数组的元素/对象的属性。在此助手内部,可以访问额外变量:

  1.   @index 仅在遍历数组时有效,当前迭代的索引
  2. @first 仅在遍历数组时有效,当前是否第一个元素
  3. @last 仅在遍历数组时有效,当前是否最后一个元素
  4. @key 仅在遍历对象时有效,当前属性的名称

遍历数组的例子:

XHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<script type="text/template7" id="example">
    <p>People list: </p>
    <ul>
        {{#each people}}
        <li>{{firstName}} {{lastName}}</li>
        {{else}}
        <li>No people</li>  
        {{/each}}
    </ul>
</script>
 
<script type="text/javascript">
    app.templates.example( {
        people : [ {
            firstName : 'Alex',
            lastName : 'Wong'
        }, {
            firstName : 'Meng',
            lastName : 'Lee'
        }, ]
    } );
</script>
<!-- 输出如下: -->
<p>People list: </p>
<ul>
  <li>Alex Wong</li>
  <li>Meng Lee</li>
</ul>  
 
<script type="text/javascript">
    app.templates.example( {} );
</script>
<!-- 输出如下: -->
<p>People list: </p>
<ul>
  <li>No people</li>
</ul>  

遍历对象的例子:

XHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<script type="text/template7" id="example">
    <p>People list: </p>
    <ul>
        {{#each alex}}
        <li>{{@key}}: {{this}}</li>
        {{/each}}
    </ul>
</script>
 
<script type="text/javascript">
    app.templates.example( {
        alex : {
            firstName : 'Alex'
            lastName : 'Wong'
        }
    } );
</script>
<!-- 输出如下: -->
<p>People list:</p>
<ul>
    <li>firstName: Alex</li>
    <li>lastName: Wong</li>
</ul>
{{#if}}...{{else}}...{{/if}}

 用于进行分支判断,只有传入的上下文变量不是false时,才会渲染if分支中的内容。下面是一个例子:

XHTML
1
2
3
4
5
6
7
8
9
10
11
12
<script type="text/template7" id="example">
    <a href="#" {{#if active}}class="active"{{/if}}>{{title}}</a>
</script>
 
<script type="text/javascript">
    app.templates.example( {
        active : true,
        title : 'Link'
    } );
</script>
<!-- 输出如下: -->
<a href="#" class="active">Link</a>
{{#unless}}...{{else}}...{{/unless}} 

与上一个助手类似,但是在传入的上下文变量是false时,渲染unless分支的内容。 

{{#with}}...{{/with}}

用于修改上下文对象。下面是一个例子:

XHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script type="text/template7" id="example">
    {{#with a}}
    <a href="#" {{#if active}}class="active"{{/if}}>{{title}}</a>
    {{/with}}
</script>
 
<script type="text/javascript">
    app.templates.example( {
        a : {
            active : true,
            title : 'Link'
        }
    } );
</script>
<!-- 输出如下: -->
<a href="#" class="active">Link</a>
{{#variableName}}...{{/variableName}}

如果块表达式中的助手名称是上下文中的变量,则效果与 {{#each variableName}} 一致。

{{join delimiter=""}}

基于分隔符把数组元素连接为字符串。

{{escape}} 

返回转移后的HTML字符串,HTML特殊字符被转写为 &**; 形式。

{{js "expression"}}

立即执行一个JavaScript表达式,并把返回值输出。

要访问当前上下文对象,必须使用 this 。

定制新助手

T7允许通过下面的方法注册新的助手:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
/**
* @param name 助手的名称
* @param helper 助手函数,用于处理上下文
*/
Template7.registerHelper(name, helper);
/**
* 助手函数规格,在此函数中,this指向表达式的执行上下文
* @param condition 包含传递进来的上下文或条件,例如{{#if true}}中condition为true
* @param options 包含若干属性和方法:
*      hash 传递给助手的哈希参数对象
*      fn 调用此方法,把块表达式的内容传递给编译器处理
*      inverse 调用此方法,把反转块表达式({{else}})的内容传递给编译器处理
*      data 包含额外的表达式数据,例如@index
* @return 可选,助手输出的内容
*/
function helper(condition, options) {}

若要解除注册,可以调用: Template7.unregisterHelper(name) 。

示例
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
/* 简单的join助手 */
Template7.registerHelper( 'join', function( arr, options ) {
    if ( typeof arr === 'function' ) arr = arr.call( this );
    //返回值直接输出到助手在模板中的位置
    return arr.join( options.hash.delimiter );
} );
 
/* ifeq助手:{{#ifeq var1 var2}}..{{else}}..{{/if}} */
Template7.registerHelper( 'ifeq', function( var1, var2, options ) {
    if ( var1 == var2 ) {
        return options.fn( this, options.data );
    }
    else {
        return options.inverse( this, options.data );
    }
} );
全局上下文

全局上下文可以在任何地方访问,使用 Template7.global 可以指定全局上下文,例如:

JavaScript
1
2
3
4
5
Template7.global = {
    os : 'iOS',
    browser : 'Chrome',
    username : 'Alex'
};

访问全局上下文,必须使用前缀 {{@global.}} 。

根上下文

某些时候需要访问传递给模板的根上下文对象,此时可以使用 {{@root}} 变量。例如:

XHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<script type="text/template7" id="example">
{{#each persons}}
    <h2>{{name}}</h2>
    {{#if @root.showHobby}}
        <h3>Hobby:</h3>
        <ul>
            {{#each hobby}}
                <li>{{this}}</li>
            {{/each}}
        </ul>
    {{/if}}
{{/each}}
</script>
 
<script type="text/javascript">
    app.templates.example( {
        persons : [ {
            name : 'Alex',
            hobby : [ 'Clectronics', 'Biology' ]
        }, {
            name : 'Meng',
            hobby : [ 'Accountancy' ]
        },
 
        ],
        showHobby : true
    } );
</script>
自动编译

在特殊标签中定义的模板,可以被F7自动编译:

XHTML
1
2
3
4
5
6
7
<!--
    type="text/template7" 告诉F7这是一个T7模板,可以被自动编译
    id="myTemplate" 指定模板的标识符,后续可以依据此标识符访问
-->
<script type="text/template7" id="iTemplate">
    <p>Hello, my name is {{name}} and i am {{age}} years old</p>
</script>

需要在应用初始化参数中启用自动编译功能:

JavaScript
1
2
3
4
var app = new Framework7( {
    // 在初始化阶段自动编译模板
    precompileTemplates : true,
} );
访问预编译模板

所有编译好的模板会存放到对象 Template7.templates 中, app.templates 是此对象的别名。在应用初始化后,可以这样使用模板:

JavaScript
1
2
3
4
var iHTML = Template7.templates.iTemplate( {
    name : 'Alex Wong',
    age : 30
} );
片段(Partials)

片段就是普通模板,只是它们供其它模板调用。通过片段,可以实现模板重用。通过下面的方法可以注册/解除注册片段:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
/**
* 注册片段
*
* @param name 片段的名称
* @param template 片段的内容,字符串
*/
Template7.registerPartial( name, template );
/**
* 解除注册片段
*
* @param name 片段的名称
*/
Template7.unregisterPartial( name );

通过特殊的助手: {{> "partialName"}} 可以调用既有的片段。 

递归片段

T7片段的一个强大特性是,片段可以调用自身。下面是一个嵌套评论(针对评论的回复)的例子:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
/* 此模板只包含一个对片段的调用 */
var template = '{{> "comments"}}';
/* 注册片段  */
Template7.registerPartial(
    'comments',
    '<ul>' +
        '{{#each comments}}' +
            '<li>' +
            '<h2>{{author}}</h2>' +
            '<p>{{text}}</p>' +
            '{{#if comments}}{{> "comments"}}{{/if}}' + //如果有针对评论的评论,则递归调用
            '</li>' +
        '{{/each}}' +
    '</ul>'
);
// 编译模板
var compiledTemplate = Template7.compile( template );
 
// 渲染模板
var output = compiledTemplate( {
    comments : [ {
        author : 'Meng Lee',
        text : 'Good article!',
        comments : [ {
            author : 'Alex Wong',
            text : 'Thanks!'
        }, {
            author : 'CaiCai Wong',
            text : 'Very funny.'
        } ]
    }, {
        author : 'WenJun Wong',
        text : 'Not good!'
    } ]
} );

输出结果如下: 

XHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<ul class="comments">
    <li>
        <h2>Meng Lee</h2>
        <p>Good article!</p>
        <ul class="comments">
            <li>
                <h2>Alex Wong</h2>
                <p>Thanks!</p>
            </li>
            <li>
                <h2>CaiCai Wong</h2>
                <p>Very funny.</p>
            </li>
        </ul>
    </li>
    <li>
        <h2>WenJun Wong</h2>
        <p>Not good!</p>
    </li>
</ul>
Template7页面

在Framework7学习笔记(一)中我们提到过F7处理页面的4种方式,最后一种Template7页面在这里讲解。

F7允许把新的Ajax页面、Dynamic页面作为Template7模板来解析,要启用此功能,需要提供应用初始化参数:

JavaScript
1
2
3
var myApp = new Framework7({
    template7Pages: true
});
模板上下文

要解析模板,必须提供必要的上下文(数据)对象。可以通过应用初始化参数template7Data设置全局的上下文:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
var myApp = new Framework7({
    template7Pages: true,
    //指定上下文对象
    template7Data: {
        // 下面这个上下文专用于URL为about.html的页面(模板)
        'url:about.html': {
            name: 'John Doe',
            age: 38,
            company: 'Apple',
            position: 'Developer'
        },
        // 下面这个上下文专用于名称为contacts(data-page="contacts")的页面(模板)
        'page:contacts': {
            tel: '(999)-111-22-33',
            email: 'contact@john.doe'
        },
        // 简单数据对象(Plain data object)
        'languages': {
            'frontend': [
                { name:'JavaScript', desc: 'Most commonly used as part of web browsers' },
                { name:'CSS' ,desc: 'Style sheet language used for describing the look and formatting of a document'},
            ],
            'backend': [
                { name: 'PHP', desc: 'Server-side scripting language designed for web development' },
                { name: 'Ruby', desc: 'Dynamic, reflective, object-oriented, general-purpose programming language'}
            ]
        }
    }
});

可以看到,上下文对象分为三种:

  1. url:*,用于特定URL的页面(模板)的上下文
  2. page:*,用于特定名称页面(模板)的上下文
  3. 简单数据对象:用于提供可供不同页面(模板)重用的、定制化的上下文

在任何时候你都可以修改模板上下文对象,你可以通过全局对象 Templates.data 或者其别名 app.template7Data 修改之。

简单数据对象

template7Data中提供的简单数据对象,用于提供复杂的、定制化的上下文。利用普通链接和 data-context-name 属性,你可以指定该链接要加载的页面(模板)所使用的上下文对象,此对象可以是一个简单数据对象,或者其点号导航的子属性([]语法不支持)。

下面的代码示意了如何使用简单数据对象作为模板上下文:

index.html
XHTML
1
2
3
4
5
6
<!-- 模板languages.html将使用上下文app.template7Data.languages来渲染  -->
<a href="languages.html" class="item-link item-content" data-context-name="languages">
    <div class="item-inner">
        <div class="item-title">Languages</div>
    </div>
</a>

languages.html
XHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<div class="page" data-page="languages">
  <div class="page-content">
    <div class="content-block-title">Frontend</div>
    <div class="list-block">
      <ul>
        <!-- 遍历app.template7Data.languages.frontend -->
        {{#each this.frontend}}
        <li>
          <!-- 嵌套的模板,支持基于点号导航(languages.frontend.1是合法的)来访问子对象 -->
          <a href="language-details.html" class="item-link item-content" data-context-name="languages.frontend.{{@index}}">
              <div class="item-inner">
                <div class="item-title">{{this.name}}</div>
              </div>
          </a>
        </li>
        {{/each}}
      </ul>
    </div>
  </div>
</div>

language-details.html
XHTML
1
2
3
4
5
6
7
8
<div class="page" data-page="language-details">
  <div class="page-content">
    <div class="content-block-title">{{name}}</div>
    <div class="content-block">
      <p>{{desc}}</p>
    </div>
  </div>
</div>

你也可以通过导航/路由 API来指定上下文对象:

JavaScript
1
2
3
4
mainView.router.load({
    url: 'language-details.html',
    contextName: 'languages.frontend.0'
})
定制的上下文

除了通过template7Data指定的全局上下文以外,你还可以使用即时指定的定制上下文。HTML方式:

XHTML
1
2
<!-- 赋值串行化的JSON对象给data-context属性 -->
<a href='contacts.html' data-context='{"tel": "(999)-111-22-33", "email": "contact@john.doe"}'>Contacts</a>

JavaScript方式:

JavaScript
1
2
3
4
5
6
7
mainView.router.load( {
    url : 'contacts.html',
    context : {
        tel : '(999)-111-22-33',
        email : 'contact@john.doe'
    }
} );
直接加载模板

F7会自动编译 <script id="templateName" type="text/template7"> 声明的模板。要将其作为Template7页面使用,可以通过HTML方式:

XHTML
1
2
<a href="#" data-template="templateName"></a>
<a href="#" data-template="templateName" data-context='{"name": "value"}'></a>

或者JavaScript方式:

JavaScript
1
2
3
4
5
6
mainView.router.load( {
    template : Template7.templates.templateName,
    context : {
        name : 'value'
    }
} );
传递URL参数 

特殊的上下文属性 url_query 用于访问URL上的GET参数:

XHTML
1
<a href="person.html?firstname=Alex&lastname=Wong&age=30">Alex</a>

person.html
XHTML
1
2
3
4
5
&nbsp;<div class="page" data-page="person">
    <div class="page-content">
        <p>Hello, my name is {{url_query.firstname}} {{url_query.lastname}}. I am {{url_query.age}} years old.</p>
    </div>
</div>
插件API

 Framework7提供了简单易用的插件API,利用这些API你可以扩展自己的F7插件。

注册新插件

只需要为 Framework7.prototype.plugins 添加一个属性,即可注册新插件。例如:

framework7.myplugin.js
JavaScript
1
2
3
4
5
6
7
8
/**
* myPlugin 新插件的名字
* app 已初始化的F7应用对象
* params 可选的插件参数
*/
Framework7.prototype.plugins.myPlugin = function( app, params ) {
    //插件代码
};

要引用新插件,只需要将其JS文件包含到HTML中,位于F7主JS文件之后:

XHTML
1
2
<script src="path/to/framework7.js"></script>
<script src="path/to/framework7.myplugin.js"></script>
向插件传递参数

在F7应用初始化的时候,可以向插件传递参数:

JavaScript
1
2
3
4
5
6
7
8
9
var myApp = new Framework7( {
    pushState : true,
    /*
     * 为myPlugin传递参数
     */
    myPlugin : {
        foo : 'bar'
    }
} );
编写插件代码

F7插件系统包含三种扩展机制:

  1. hooks:与通常的回调类似,由F7在框架的很多核心部分调用。可以在特定时刻/场景执行插件代码、处理数据
  2. prevents:用于阻止F7默认行为,例如阻止默认页面动画而使用自己的
  3. processes:类似于预处理器,每个处理方法可以接收被处理数据

插件函数的返回值必须是一个对象,其包括hooks、prevents和processes属性。例如:

JavaScript
1
2
3
4
5
return {
    hooks : {
        appInit : function(){}
    }
};
Hooks

可用的钩子包括:

钩子 说明
appInit 当应用完全初始化后调用
navbarInit (navbar, pageData) 和navbarInit事件一样
pageInit (pageData) 和navbarInit事件/回调一样
pageBeforeInit (pageData) 和pageBeforeInit事件/回调一样
pageBeforeAnimation (pageData) 和pageBeforeAnimation事件/回调一样
pageAfterAnimation (pageData) 和pageAfterAnimation事件/回调一样
pageBeforeRemove (pageData) 和pageBeforeRemove事件/回调一样
addView (view) 当用户通过app.addView()添加新的视图时触发,入参是已实例化的视图对象
loadPage (view, url, content) 在新页面开始被加载时调用,此时页面尚未加入到DOM中
goBack (view, url, preloadOnly) 在返回操作开始前调用 
swipePanelSetTransform (views, panel, percentage) 侧面板滑出/滑入的过程中调用 

 

← Go语言并发编程
树莓派3B安装记录 →

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

Related Posts

  • Framework7知识集锦
  • 基于AngularJS开发Web应用
  • HTTP知识集锦
  • HTML5视频监控技术预研
  • 使用Babel进行JS转码

Recent Posts

  • Investigating and Solving the Issue of Failed Certificate Request with ZeroSSL and Cert-Manager
  • A Comprehensive Study of Kotlin for Java Developers
  • 背诵营笔记
  • 利用LangChain和语言模型交互
  • 享学营笔记
ABOUT ME

汪震 | Alex Wong

江苏淮安人,现居北京。目前供职于腾讯云,专注容器方向。

GitHub:gmemcc

Git:git.gmem.cc

Email:gmemjunk@gmem.cc@me.com

ABOUT GMEM

绿色记忆是我的个人网站,域名gmem.cc中G是Green的简写,MEM是Memory的简写,CC则是我的小天使彩彩名字的简写。

我在这里记录自己的工作与生活,同时和大家分享一些编程方面的知识。

GMEM HISTORY
v2.00:微风
v1.03:单车旅行
v1.02:夏日版
v1.01:未完成
v0.10:彩虹天堂
v0.01:阳光海岸
MIRROR INFO
Meta
  • Log in
  • Entries RSS
  • Comments RSS
  • WordPress.org
Recent Posts
  • Investigating and Solving the Issue of Failed Certificate Request with ZeroSSL and Cert-Manager
    In this blog post, I will walk ...
  • A Comprehensive Study of Kotlin for Java Developers
    Introduction Purpose of the Study Understanding the Mo ...
  • 背诵营笔记
    Day 1 Find Your Greatness 原文 Greatness. It’s just ...
  • 利用LangChain和语言模型交互
    LangChain是什么 从名字上可以看出来,LangChain可以用来构建自然语言处理能力的链条。它是一个库 ...
  • 享学营笔记
    Unit 1 At home Lesson 1 In the ...
  • K8S集群跨云迁移
    要将K8S集群从一个云服务商迁移到另外一个,需要解决以下问题: 各种K8S资源的迁移 工作负载所挂载的数 ...
  • Terraform快速参考
    简介 Terraform用于实现基础设施即代码(infrastructure as code)—— 通过代码( ...
  • 草缸2021
    经过四个多月的努力,我的小小荷兰景到达极致了状态。

  • 编写Kubernetes风格的APIServer
    背景 前段时间接到一个需求做一个工具,工具将在K8S中运行。需求很适合用控制器模式实现,很自然的就基于kube ...
  • 记录一次KeyDB缓慢的定位过程
    环境说明 运行环境 这个问题出现在一套搭建在虚拟机上的Kubernetes 1.18集群上。集群有三个节点: ...
  • eBPF学习笔记
    简介 BPF,即Berkeley Packet Filter,是一个古老的网络封包过滤机制。它允许从用户空间注 ...
  • IPVS模式下ClusterIP泄露宿主机端口的问题
    问题 在一个启用了IPVS模式kube-proxy的K8S集群中,运行着一个Docker Registry服务 ...
  • 念爷爷
      今天是爷爷的头七,十二月七日、阴历十月廿三中午,老人家与世长辞。   九月初,回家看望刚动完手术的爸爸,发

  • 6 杨梅坑

  • liuhuashan
    深圳人才公园的网红景点 —— 流花山

  • 1 2020年10月拈花湾

  • 内核缺陷触发的NodePort服务63秒延迟问题
    现象 我们有一个新创建的TKE 1.3.0集群,使用基于Galaxy + Flannel(VXLAN模式)的容 ...
  • Galaxy学习笔记
    简介 Galaxy是TKEStack的一个网络组件,支持为TKE集群提供Overlay/Underlay容器网 ...
TOPLINKS
  • Zitahli's blue 91 people like this
  • 梦中的婚礼 64 people like this
  • 汪静好 61 people like this
  • 那年我一岁 36 people like this
  • 为了爱 28 people like this
  • 小绿彩 26 people like this
  • 杨梅坑 6 people like this
  • 亚龙湾之旅 1 people like this
  • 汪昌博 people like this
  • 彩虹姐姐的笑脸 24 people like this
  • 2013年11月香山 10 people like this
  • 2013年7月秦皇岛 6 people like this
  • 2013年6月蓟县盘山 5 people like this
  • 2013年2月梅花山 2 people like this
  • 2013年淮阴自贡迎春灯会 3 people like this
  • 2012年镇江金山游 1 people like this
  • 2012年徽杭古道 9 people like this
  • 2011年清明节后扬州行 1 people like this
  • 2008年十一云龙公园 5 people like this
  • 2008年之秋忆 7 people like this
  • 老照片 13 people like this
  • 火一样的六月 16 people like this
  • 发黄的相片 3 people like this
  • Cesium学习笔记 90 people like this
  • IntelliJ IDEA知识集锦 59 people like this
  • 基于Kurento搭建WebRTC服务器 38 people like this
  • Bazel学习笔记 37 people like this
  • PhoneGap学习笔记 32 people like this
  • NaCl学习笔记 32 people like this
  • 使用Oracle Java Mission Control监控JVM运行状态 29 people like this
  • 基于Calico的CNI 27 people like this
  • Ceph学习笔记 27 people like this
  • Three.js学习笔记 24 people like this
Tag Cloud
ActiveMQ AspectJ CDT Ceph Chrome CNI Command Cordova Coroutine CXF Cygwin DNS Docker eBPF Eclipse ExtJS F7 FAQ Groovy Hibernate HTTP IntelliJ IO编程 IPVS JacksonJSON JMS JSON JVM K8S kernel LB libvirt Linux知识 Linux编程 LOG Maven MinGW Mock Monitoring Multimedia MVC MySQL netfs Netty Nginx NIO Node.js NoSQL Oracle PDT PHP Redis RPC Scheduler ServiceMesh SNMP Spring SSL svn Tomcat TSDB Ubuntu WebGL WebRTC WebService WebSocket wxWidgets XDebug XML XPath XRM ZooKeeper 亚龙湾 单元测试 学习笔记 实时处理 并发编程 彩姐 性能剖析 性能调优 文本处理 新特性 架构模式 系统编程 网络编程 视频监控 设计模式 远程调试 配置文件 齐塔莉
Recent Comments
  • qg on Istio中的透明代理问题
  • heao on 基于本地gRPC的Go插件系统
  • 黄豆豆 on Ginkgo学习笔记
  • cloud on OpenStack学习笔记
  • 5dragoncon on Cilium学习笔记
  • Archeb on 重温iptables
  • C/C++编程:WebSocketpp(Linux + Clion + boostAsio) – 源码巴士 on 基于C/C++的WebSocket库
  • jerbin on eBPF学习笔记
  • point on Istio中的透明代理问题
  • G on Istio中的透明代理问题
  • 绿色记忆:Go语言单元测试和仿冒 on Ginkgo学习笔记
  • point on Istio中的透明代理问题
  • 【Maven】maven插件开发实战 – IT汇 on Maven插件开发
  • chenlx on eBPF学习笔记
  • Alex on eBPF学习笔记
  • CFC4N on eBPF学习笔记
  • 李运田 on 念爷爷
  • yongman on 记录一次KeyDB缓慢的定位过程
  • Alex on Istio中的透明代理问题
  • will on Istio中的透明代理问题
  • will on Istio中的透明代理问题
  • haolipeng on 基于本地gRPC的Go插件系统
  • 吴杰 on 基于C/C++的WebSocket库
©2005-2025 Gmem.cc | Powered by WordPress | 京ICP备18007345号-2