CN105164668A - 多维布局的自动对准 - Google Patents

Abstract

由系统确定用于内容流的多个内容项。所述系统对于所述内容项估计大小维度，并且通过基于所述大小维度将所述内容项放置到两个或更多个相邻容器中来确定多维布局。所述系统确定所述两个或更多个相邻容器之间的大小差并且调整所述内容项中的一个或多个的方面以使所述两个或更多个容器的大小基本上相等。

Description

多维布局的自动对准

相关申请的交叉引用

本申请要求题为“AutomaticAlignmentofaMulti-DimensionalLayout”并且于2013年3月6日提交的美国临时申请No.61/773,548以及题为“AutomaticAlignmentofaMulti-DimensionalLayout”并且于2013年5月14日提交的美国专利申请No.13/894,327的权益，其中的每一个的整个内容通过引用合并于此。

技术领域

本公开涉及自动地对准多维布局。

背景技术

当将信息显示给用户时，可能难以以阵列元素对准出现并且在视觉上引人入胜的这样的方式将多个可变大小的内容元素对准成多维阵列(例如列)。例如，给定内容元素可以包含比相邻内容元素多的信息(例如，文本、图片等)，使元素具有不同的总体大小。此外，布局的每列可以包括具有不同大小的多个内容元素，这能够使列具有不同的总体高度并且出现未对准。当使用灵活布局时还可能使问题恶化，所述灵活布局能够响应于正被用来查看布局的视口的大小调整而调整正被显示的列的数目，并且因此调整由列所包含的内容。

发明内容

根据在本公开中描述的主题的一个创新方面，系统可以为内容流确定多个内容项并且对于内容项估计大小维度。系统可以通过基于大小维度将内容项放置到两个或更多个相邻容器中来确定多维布局，确定两个或更多个相邻容器之间的大小差，并且调整内容项中的一个或多个的方面以使两个或更多个容器的大小基本上相等。

一般而言，在本公开中描述的主题的另一创新方面可以用包括以下步骤的方法具体化：为内容流确定多个内容项；对于内容项估计大小维度；通过基于大小维度将内容项放置到两个或更多个相邻容器中来确定多维布局；确定两个或更多个相邻容器之间的大小差；以及调整内容项中的一个或多个的方面以使两个或更多个容器的大小基本上相等。

这些方面中的一个或多个的其它实施方式包括对应的系统、设备以及计算机程序，所述计算机程序被配置成执行方法的动作，被编码在计算机存储装置上。

这些和其它实施方式每个可以可选地包括以下特征中的一个或多个。例如，操作还可以进一步包括：调整内容项中的一个或多个的方面包括在两个或更多个相邻容器之间交换内容项中的两个或更多个；在两个或更多个相邻容器之间交换内容项中的两个或更多个包括确定对于两个或更多个内容项中的每一个的排名弹性测量满足预定阈值；调整内容项中的一个或多个的方面包括调整内容项中的一个或多个的高度；对于被指定为显示内容流中的多个内容项的视口确定视口属性；基于视口属性为多维布局确定列的数量；两个或更多个相邻容器中的每一个表示多维布局的列；渲染两个或更多个相邻容器；基于渲染为两个或更多个相邻容器中的每一个确定高度；两个或更多个相邻容器中的每一个表示多维布局的列并且确定两个或更多个相邻容器之间的大小差包括比较两个或更多个相邻容器中的每一个的高度；以及处理优化的布局以改进将来的多个内容项在将来的多维布局中的放置。

这些实施方式在许多方面是特别有利的。例如，本文中所描述的技术能够消除隐藏、裁剪或截断内容以便在视口的大小调整或新内容的添加后在布局的列之间创建对准的需要。另外，该技术可以在服务器和客户端上在多个列中渲染流项同时使它们之间的垂直空白最小化，基于窗口大小支持流项宽度的快速缩放和多个列之间的弹出，并且能够跨越多个列渲染某些候选项。然而，应该理解，上述特征和优点不是包括一切的，以及许多附加特征和优点被预期到并且落入本公开的范围内。而且，应该注意，本公开中使用的语言已被主要选择用于易读性和指示目的，并且不限制本文中所公开的主题的范围。

附图说明

本公开通过示例而不通过限制被图示在附图的图中，在附图中同样的附图标记被用来指代类似的元素。

图1是图示用于自动地对准多维布局的示例系统的框图。

图2A和图2B是图示示例应用服务器的框图。

图3A和图3B是图示示例客户端装置的框图。

图4是示出示例前端渲染引擎和示例后端渲染引擎的示例组件之间的交互的图。

图5是用于自动地确定并且优化多维布局的示例方法的流程图。

图6是用于优化预定初始布局的示例前端方法的流程图。

图7是用于确定初始布局的示例后端方法的流程图。

图8是用于将新帖子加载到内容流中的示例方法的流程图。

图9是图示示例初始布局的优化的图。

图10是图示示例初始布局的帖子的重新布置的图。

图11是图示帖子在示例布局内到超级帖子的提升的图。

图12是图示基于候选资格的示例超级帖子的选择和放置的图。

图13是图示多列布局引擎基于视口大小选择性地确定示例布局参数和内容布置的灵活性的图。

图14是图示多列布局引擎基于视口大小选择性地确定示例布局参数和内容布置的灵活性的图。

图15A和图15B是用于查看实时地加载到内容流中的新帖子的示例用户界面的图形表示。

图16是具有帖子的优化布局的包含内容流的示例用户界面的图形表示。

具体实施方式

图1是图示用于对准多维布局的示例系统100的框图。在所描绘的实施方式中，系统100包括应用服务器118以及可由用户114a...114n(在本文中还被单独地和共同地称为114)访问的客户端装置106a…106n(在本文中还被单独地和共同地称为106)。在所描绘的实施方式中，实体106a…106n和实体118经由网络102电子地通信地耦合。然而，本公开不限于该配置并且各种不同的系统环境和配置可以被采用并在本公开的范围内。其它实施方式可以包括附加的或较少的计算装置、服务和/或网络。例如，其它计算装置(例如，第三方服务器)可以耦合到网络102以提供各种服务和功能性。另外，虽然上面主要在与社交网络有关的活动的上下文中描述本公开，但是它可应用于在网络的实体内或之间的任何类型的电子通信。

在一些实施方式中，系统100的实体可以使用一个或多个计算机功能或例程由远程计算系统和装置应本地计算装置的请求而执行的基于云的架构。例如，客户端装置106可以是具有硬件和/或软件资源的计算装置并且可以通过其它计算装置和资源(包括例如系统100的其它客户端装置106、应用服务器118或任何其它实体)来访问跨越网络102提供的硬件和/或软件资源。

网络102是用于互连计算节点的网络。网络102可以具有任何数目的配置或拓扑。例如，网络102可以具有星型、令牌环或其它已知拓扑或其混合。网络102可以包括局域网(LAN)、广域网(WAN)(例如，因特网)和/或多个装置可以跨越其通信的任何其它互连的数据路径。网络102可以耦合到或者包括包含有分布式无线电网络和提供无线广域网(WWAN)的集线器的移动(蜂窝)网络，或其它电信网络。在一些实施方式中，网络102可以包括用于发送和接收数据的通信网络。网络102可以使用包括例如各种因特网层、传输层或应用层协议的各种不同的通信协议来发送数据。例如，网络102可以使用用户数据报协议(UDP)、传输控制协议(TCP)、HTTP、HTTPS、文件传送协议(FTP)、WebSocket(WS)、WAP、IMAP、SMTP、POP、SMS协议、MMS协议、XMS协议或其它已知协议来发送数据。

客户端106a…106n是具有数据处理和数据通信能力的计算装置。在所描绘的实施方式中，客户端装置106a经由信号线104a耦合到网络102，并且用户114a与客户端装置106a的交互由线112a描绘；并且客户端装置106n经由信号线104n耦合到网络102，并且用户114n与客户端装置106n的交互由线112n描绘。

在一些实施方式中，客户端装置106包括工作站计算机、台式计算机、膝上型计算机、笔记本计算机、平板计算机、智能电话、机顶盒/单元、包括能够接收观众输入、访问计算机网络(例如，因特网)上的视频内容以及执行软件例程以向观众提供增强的功能性和交互性的计算机处理器的网际协议连接的智能TV等。在一些实施方式中，客户端装置106可以是能够发送和接收语音和/或数据通信的手持无线计算装置。

在所描绘的实施方式中，客户端装置106a...106n分别包括客户端应用108a...108n(在本文中还被单独地和共同地称为108)和前端渲染引擎110a...110n。客户端应用108a…108n可由客户端装置106a…106n执行来渲染用户界面，接收用户输入，并且向系统100的应用服务器118和任何其它实体发送信息并且从系统100的应用服务器118和任何其它实体接收信息。前端渲染引擎110a…110n(在本文中还被单独地和共同地称为110)可以由客户端装置106a…106n执行来接收和/或调整/优化内容的布局。在一些实施方式中，客户端应用108可以与前端渲染引擎110协作来经由显示器(未示出)向用户114渲染并且显示内容。例如，前端渲染引擎110可以将社交网络内容流的内容项(例如，帖子)渲染并且组织成优化的布局并且可以指示客户端应用108(例如，经由客户端应用108的API)使用该布局来显示内容项(例如，帖子)。如在下面更详细地讨论的，图15A、图15B和图16描绘可以由客户端应用108与前端渲染引擎110协作至少部分地基于经由网络102从应用服务器118接收到的信息来渲染和显示的用户界面的非限制性示例。

在一些实施方式中，前端渲染引擎110和/或客户端应用108可以以标记语言(例如，HTML、XML等)、样式表(例如，GSS、CSS、XSL等)、图形和/或脚本(例如，JavaScript、ActionScript等)的形式经由网络102从应用服务器118的应用引擎122或后端渲染引擎120接收界面指令，并且然后可以解析界面指令并渲染交互式Web用户界面(WUI)以用于基于其显示在客户端装置106上。在一些实施方式中，界面指令中的一些或全部可以由客户端应用108和/或前端渲染引擎110提供，而实质信息可以由应用服务器118提供。其它变化也被预期并且在本公开的范围内。

视口是包括用于用户查看内容并且与内容交互的界面的可由客户端应用108显示的可视区域。在一些实施方式中，客户端应用108可以包括web浏览器并且视口可以包括用于显示从存储器和/或网络102检索到的内容的web浏览器的窗口和/或选项卡，但是其它配置被预期并且是可能的。

如图1中所描绘的，应用服务器118经由信号线116耦合到网络102以用于与耦合到网络102的其它组件交互。应用服务器118可以包括具有一个或多个处理器的一个或多个计算装置，以及用于存储数据或指令以供由一个或多个处理器执行的一个或多个存储装置。例如，计算装置可以是具有数据处理、存储和通信能力的硬件服务器、服务器阵列或任何其它计算装置，或计算装置组。计算装置还可以是经由软件实现的虚拟服务器(例如，虚拟机)。例如，虚拟服务器可以在主机服务器环境中操作并且经由抽象层(例如，虚拟机管理器)访问包括例如处理器、存储器、存储、网络接口等的主机服务器的物理硬件。尽管示出了仅一个应用服务器118，但是可以在系统100中包括任何数目的应用服务器118和/或其它计算装置。此外，应该理解，系统100的实体中的任一个能够被存储在装置和服务器的任何组合中或在一个装置或服务器中。

在所描绘的实施方式中，应用服务器118包括应用引擎122和后端渲染引擎120。在一些实施方式中，应用引擎122包括被配置成为社交网络服务(还被称为社交网络)提供功能的社交网络应用并且后端渲染引擎120接收并且组织从社交网络应用接收到的信息。例如，后端渲染引擎120可以对于由应用引擎122确定并且指定来提供给给定用户以用于显示和交互的一组内容流项(例如，帖子)来渲染初始布局。

应该理解，应用引擎122可以包括提供可渲染用于显示给用户的内容项的集合或流的任何服务，包括例如但不限于新闻服务、提供各种产品以用于销售的电子商务网站、提供用于比较和购买产品的功能的比较购物服务、微博流、博客服务等。作为另一示例而非限制，应用引擎122可应用于内容项可显示在多维阵列中(例如，在列和/或行中)的任何内容服务等。在下面参考至少图2A和图2B进一步描述了应用引擎122和后端渲染引擎120的附加结构、行为和/或功能。虽然仅应用服务器118在图1中被描绘为包括后端渲染引擎120，但是应该理解，该实施方式通过示例来提供并且任何单个实体或任何数目的实体可以包括后端渲染引擎120的实例。内容项(例如，帖子)可以包括可以被渲染用于显示给用户的一个或多个组件(例如，文本、嵌入式内容、图像、视频、界面元素等)。在一些实施方式中，内容项可以包括mixin，其包括要求用户动作(例如，请求用户完成用户的简档的方面、就系统的未知或未充分使用的特征和功能而通知用户等)的内容。应该理解，虽然在帖子的上下文内描述了本文中所提供的一些实施方式，但是应该理解，这些实施方式是非限制性的并且可应用于可包括在内容流中的任何类型和/或形式的内容项。

系统100的应用引擎122或另一组件可能需要用户注册用户账户以访问由此提供的各种功能和服务。例如，为了注册，包括在系统100的给定实体(例如，应用服务器118、第三方服务器(未示出)等)中并且操作系统100的给定实体(例如，应用服务器118、第三方服务器(未示出)等)的证书模块可能需要用户114提供标识信息，例如，有效的电子地址和密码，并且该模块可以通过向电子地址发送包含用于确认帐户的指令的确认消息(例如，选择到由服务提供商操作的确认网页的超链接)来测试该地址的有效性。一旦被注册，证书模块就可能需要用户尝试访问由这个实体操作的服务以通过在关联的用户界面中输入标识信息进行认证。

图2A和图2B是示例应用服务器118的框图。在所描绘的实施方式中，应用服务器118包括经由总线206通信地耦合的处理器202、存储器204、通信单元208、社交图210以及数据存储212。存储器204被描绘为包括应用引擎122和后端渲染引擎120。在各种实施方式中，应用引擎122和/或后端渲染引擎120可以是存储在存储器204中并且可由处理器202执行以用于与应用服务器118的其它组件通信的指令集；可以经由耦合到总线206以用于与应用服务器118的其它组件协作和通信的一个或多个专用集成电路(ASIC)来实现；存储在耦合到总线206以用于与应用服务器118的其它组件协作和通信的一个或多个分立存储器装置(例如，PROM、FPROM、ROM)中的指令集；其它硬件和软件；其组合；等。

图2A中所描绘的应用服务器118通过示例来提供，并且应该理解，在不脱离本公开的范围的情况下应用服务器118可以采取其它形式并且包括附加的或较少的组件。例如，虽然未示出，但是在一些实施方式中，应用服务器118可以包括输入和输出装置(例如，计算机显示器、键盘和鼠标等)、各种操作系统、传感器、附加处理器以及其它物理配置。另外，应该理解，图2A中所描绘的计算机架构可应用于具有各种修改的系统100的其它实体。例如，第三方服务器(未示出)能够具有与图2A中所描绘的应用服务器118相同或类似的架构，包括例如经由总线206耦合的处理器202、存储器204、通信单元208以及数据存储212。

总线206能够包括用于在计算装置的组件之间或在计算装置之间传送数据的常规通信总线、包括网络102或其部分的网络总线系统、处理器网格、其组合等。在一些实施方式中，应用引擎122、后端渲染引擎120及其子组件220、222、224、226、228和230(参见图2B)和/或在应用服务器118上操作的各种软件(例如，操作系统)可以经由与总线206相关联地实现的软件通信机制进行协作和通信。软件通信机制能够包括和/或便于例如进程间通信、本地功能或过程调用、远程过程调用、对象总线(例如，CORBA)、软件模块之间的直接套接字通信(例如，TCP/IP套接字)、UDP广播和接收、HTTP连接等。另外，通信中的任一个或全部可以是安全的(例如，SSH、HTTPS等)。

处理器202包括算术逻辑单元、微处理器、通用控制器，或用于执行计算并且将电子显示信号提供给显示装置(未示出)的一些其它处理器阵列。处理器202可以耦合到总线206以用于与应用服务器118的其它组件通信。处理器202可以处理数据信号并且可以具有包括复杂指令集计算机(CISC)架构、精简指令集计算机(RISC)架构或实现指令集的组合的架构的各种计算架构。尽管在图2A中示出了仅单个处理器202，但是可以包括多个处理器并且每个处理器可以包括单个处理核或多个互连的处理核。处理器202可以能够支持图像的显示以及图像的捕获和传输，执行复杂任务，包括各种类型的特征提取和采样等。

存储器204存储可以由处理器202执行的指令和/或数据。在所描绘的实施方式中，存储器204存储至少应用引擎122和后端渲染引擎120。存储器204还能够存储其它指令和数据，包括例如操作系统、硬件驱动器、其它软件应用、数据库等。存储器204耦合到总线206以用于与应用服务器118的处理器202和其它组件通信。指令和/或数据可以包括用于执行本文中所描述的技术中的任一个和/或全部的代码。具体地，存储器204包括非瞬时计算机可用(例如，可读、可写等)介质，其可以是能够包含、存储、传送、传播或传输指令、数据、计算机程序、软件、代码、例程等以用于由处理器202处理或者连同处理器202一起处理的任何设备或装置。非瞬时计算机可用存储介质可以包括任何和/或所有计算机可用存储介质。在一些实施方式中，存储器204可以包括易失性存储器、非易失性存储器或两者。例如，存储器204可以包括动态随机存取存储器(DRAM)装置、静态随机存取存储器(SRAM)装置、闪速存储器、硬盘驱动器、软盘驱动器、CDROM装置、DVDROM装置、DVDRAM装置、DVDRW装置、闪速存储器装置以及已知用于在更永久基础上存储信息的任何其它大容量存储装置中的一个或多个。应该理解，存储器204可以是单个装置或者可以包括多个类型的装置和配置。

通信单元208可以包括用于与其它电子装置进行通信的装置。例如，通信单元208可以包括无线网络收发器(例如，Wi-Fi^TM、蜂窝)、有线网络接口(例如，CAT型接口)、USB、火线或其它已知接口。通信单元208可以使用包括例如参考网络102所讨论的那些协议的标准通信协议来提供到网络102和到系统100的其它实体的连接。通信单元208可以从处理器202链接到网络102，所述网络102进而可以耦合到其它处理系统。在所描绘的实施方式中，通信单元208经由信号线116耦合到网络102以用于与系统100的其它实体通信和交互。

社交网络是其中用户通过一个或多个公共特征连接的任何类型的社交结构。公共特征能够包括任何属性、兴趣、偏好、关系或可归因于用户的交互。例如，公共特征包括关系/连接，例如，专业与学术属性和兴趣、友谊、家族关系等。公共特征还能够包括显式地定义的关系以及由与其它在线用户和实体的社交连接所暗示的关系。公共特征能够由一个或多个社交网络系统(包括例如应用引擎122)来提供。可以作为用户的简档信息而存储的这些公共特征能够由应用引擎122映射来连接用户。

用户的社交图可以包括描述用户与社交网络的其他用户之间的连接的社交图连接信息；什么公共特征(例如，属性、兴趣、社交网络活动、关系等)将该用户连接到其他用户；由该用户和/或应用引擎122形成来对他或她在社交网络上的连接进行分类或分组的任何组/集合；能够例如基于该用户与为连接/填隙用户的其他用户(若有的话)之间的分离的一个或多个程度(例如，第一、第二、第三、第四等)来计算的该用户与其他用户之间的连接(例如，亲合力)的强度；用户之间的交互的量或类型等；等。例如，应用引擎122和/或用户(例如，经由关联的用户界面)可以定义作为工作朋友、学校朋友、网络联系人、客户等的用户的组，并且用户的社交图可以包括反映这些用户属于什么组的数据。同时，用户的社交图形成反映社交网络的用户中的全部的映射以及他们如何有关的集体社交图210。

在一些实施方式中，由社交图210所存储的信息可以被存储在应用服务器118的存储器204或数据存储中，或者可以被包括在与应用服务器118不同但是可由应用服务器118访问的存储器、计算装置和/或存储系统中。在各种实施方式中，社交图210与可由处理器202执行的文件系统协作存储记录、文件、对象、数据等。社交图210可以附加地或替选地包括可由处理器202执行来管理记录、文件、对象等的集合的数据库管理系统(DBMS)。例如，数据库可以是存储能够通过系统100的应用引擎122、后端渲染引擎120以及其它实体使用编程操作(例如，查询和语句)来操纵的数据的结构化查询语言(SQL)和/或NoSQLDBMS。

数据存储212是能够将对数据的访问进行存储并且提供给耦合到网络102的各种实体的信息源。在所描绘的实施方式中，数据存储212经由总线206耦合用于与服务器118的组件202、204、208和210通信，并且经由处理器202耦合以用于与后端渲染引擎120的组件220、222、224、226、228和230(参见图2B)以及后端渲染引擎120本身通信。在一些实施方式中，数据存储212包括可在应用服务器118或另一计算装置上操作并且可存储在其存储器中的数据库管理系统(DBMS)。例如，DBMS可以是结构化查询语言(SQL)DBMS，并且组件120、220、222、224、226、228和230(参见图2B)被配置成使用编程操作(例如，SQL查询和语句)来操纵(例如，存储、查询、更新和/或删除)存储在数据存储212中的数据。

由数据存储212所存储的数据可以包括由后端渲染引擎120和/或其子组件220、222、224、226、228和230(参见图2B)、应用服务器118、前端渲染引擎110和/或其子组件等生成、接收或者发送的信息。在一些实施方式中，数据存储212可以存储包括由后端渲染引擎120处理的内容项(例如，帖子)的元数据(包括例如但不限于估计高度210、模板块212、排名214、排名的弹性216、超级帖子候选资格比特218)以及其它元数据219(例如，唯一项id、固定位置指示器等)等的布局对象。附加地或替选地，数据存储212可以存储由后端渲染引擎120确定的初始布局、由前端渲染引擎110处理的优化布局、用于改进高度估值和布局算法的机器学习数据等。在一些实例中，组件220、222、224、226、228、230、108、110、120和/或122中的一个或多个可以使用存储在数据存储212中并且可从数据存储212中检索的数据来执行如在本文中别处所讨论的它们相应的功能性。使用机器学习的技术效果是后端引擎能够使用于计算布局的算法和启发自动化和简化，从而减小它的总体实现复杂性，同时维持或者改进初始布局并且消除对于人为参与的需要。

后端渲染引擎120是用于为一组内容项(例如，帖子)确定初始布局的软件、代码、逻辑或例程。在一些实施方式中，后端渲染引擎120可以被配置成确定内容项的属性(例如，高度估值、超级帖子候选资格等)，确定和/或提升超级帖子候选，将初始布局提供给前端渲染引擎110以用于进一步处理，处理过去的布局及其优化以改进将来的布局等。从而改进布局包括改进多个内容项在多维阵列中的放置，诸如内容项被作为元素布置在阵列中、出现对准并且在视觉上引人入胜从而避免并且使布局中的未对准和间隙最小化。由后端渲染引擎确定的初始布局可以是灵活的并且可以被配置成适于对视口的改变，包括例如但不限于窗口大小改变。

如图2B中所描绘的，后端渲染引擎120包括协作地提供后端渲染引擎120的功能的获取活动动作模块220、流构建器222、流渲染器224、高度估计器226、多列布局引擎228以及布局生成器230。然而，图2B中所图示的布置通过示例来提供，并且应该理解，其它布置是可能的。例如，替选布置能够将组件220、222、224、226、228和/或230中的一个或多个的功能组合成单个组件，将后端渲染引擎120集成到其它软件应用(例如，应用引擎122)中，或者反之亦然，或者进一步将模块划分成单独的附加协作式组件。

在所描绘的实施方式中，组件220、222、224、226、228和/或230电子地通信地耦合以用于与彼此、应用引擎122、处理器202、存储器204、通信单元208、社交图210和/或数据存储212协作和通信。这些组件220、220、224、226、228和230还经由网络102耦合以用于与系统100的其它实体(例如，客户端装置106、应用服务器118等)通信。

在一些实施方式中，应用服务器118、后端渲染引擎120、获取活动动作模块220、流构建器222、流渲染器224、高度估计器226、多列布局引擎228以及布局生成器230是可由处理器202执行的指令集，或包括在一个或多个定制处理器中的逻辑，以提供它们相应的功能。在一些实施方式中，应用服务器118、后端渲染引擎120、获取活动动作模块220、流构建器222、流渲染器224、高度估计器226、多列布局引擎228和/或布局生成器230被存储在应用服务器118的存储器204并且可由处理器202访问和执行来提供它们相应的功能。在这些实施方式中的任一个中，应用服务器118、后端渲染引擎120、获取活动动作模块220、流构建器222、流渲染器224、高度估计器226、多列布局引擎228和/或布局生成器230被适配用于与应用服务器118的处理器202和其它组件协作和通信。

在下面参考至少图4进一步讨论包括获取活动动作模块220、流构建器222、流渲染器224、高度估计器226、多列布局引擎228以及布局生成器230的后端渲染引擎120的附加结构、行为和/或功能。

图3A是示例客户端装置106的框图。如所描绘的，客户端装置106可以包括通过通信总线306通信地耦合的处理器302、存储器304、通信单元308、显示装置310和/或输入装置312。然而，应该理解，客户端装置106不限于这样并且还可以包括其它元件，包括例如但不限于电源、图形处理器、高分辨率触摸屏、物理键盘、前向和背向相机、像加速度计和/或陀螺仪这样的传感器、GPS接收器、模块、存储可应用固件的存储器以及各种物理连接接口(例如，USB、HDMI、耳机插孔等)等。

处理器302可以通过执行各种输入/输出、逻辑和/或数学操作来执行软件指令。处理器302具有用于处理数据信号的各种计算架构，包括例如复杂指令集计算机(CISC)架构、精简指令集计算机(RISC)架构和/或实现指令集的组合的架构。处理器302可以是物理的和/或虚拟的，并且可以包括单个核或多个处理单元和/或核。

存储器304可以将对数据的访问存储并且提供给客户端装置106的其它组件。在一些实施方式中，存储器304可以存储可以由处理器302执行的指令和/或数据。例如，如所描绘的，存储器304可以存储客户端应用108和/或前端渲染引擎110。存储器304还能够存储其它指令和数据，包括例如操作系统、硬件驱动器、其它软件应用、数据等。存储器304可以耦合到总线306以用于与客户端装置106的处理器302和其它组件通信。

通信单元308可以包括一个或多个接口装置(I/F)以用于与网络102和/或其它装置的有线和/或无线连接。在一些实施方式中，通信单元308可以包括用于发送和接收无线信号的收发器。例如，通信单元308可以包括用于蜂窝通信的无线电收发器(4G、3G、2G等)以及用于Wi-Fi^TM和极接近(例如，NFC等)连接的无线电收发器。例如，通信单元308可以连接到网络102的移动网络、网络102的公用IP网络、网络102的专用IP网络等并且经由网络102的移动网络、网络102的公用IP网络、网络102的专用IP网络等发送/接收数据。在一些实施方式中，通信单元308可以包括用于与其它装置的有线连接的端口。例如，通信单元308可以包括CAT-5接口、USB接口等。在所描绘的实施方式中，通信单元308经由信号线104耦合到网络102以用于与系统100的其它实体通信和交互。

显示装置310可以显示由客户端装置108输出以用于呈现给用户114的电子图像和数据。显示装置310可以包括任何常规的显示装置、监视器或屏幕，包括例如有机发光二极管(OLED)显示器、液晶显示器(LCD)等。在一些实施方式中，显示装置310可以是能够从用户114的一个或多个手指接收输入的触摸屏显示器。例如，显示装置310可以是能够检测并且解析与显示表面接触的多个点的电容式触摸屏显示器。在一些实施方式中，客户端装置106可以包括用于渲染并且输出图像和数据以用于呈现在显示装置310上的图形适配器(未示出)。该图形适配器(未示出)可以是包括单独的处理器和存储器(未示出)的单独的处理装置或者可以与处理器302和存储器304集成。

输入装置312可以包括用于将信息输入到客户端装置106中的任何装置。在一些实施方式中，输入装置312可以包括一个或多个外围装置。例如，输入装置312可以包括键盘(例如，QWERTY键盘)、指示装置(例如，鼠标或触摸板)、麦克风、图像/视频捕获装置(例如，相机)等。在一些实施方式中，输入装置312可以包括能够从用户114的一个或多个手指接收输入的触摸屏显示器。例如，可以集成输入装置312和显示装置310的功能，并且客户端装置106的用户114可以通过使用一个或多个手指接触显示装置310的表面来与客户端装置106交互。在这个示例中，用户114能够通过使用手指来接触在键盘区域中的显示器与在触摸屏显示装置310上显示的仿真(例如，虚拟或软)键盘交互。

如图3B中所描绘的，前端渲染引擎110可以包括流加载器320、多列布局引擎322、响应布局模块324、卡片伸展器326、抽象流组件328以及书签模块330。组件320、322、324、326、328和/或330可以通过总线306和/或处理器302通信地耦合到彼此和/或客户端装置106的其它组件304、308、310以及312。在一些实施方式中，组件320、322、324、326、328和/或330中的一个或多个是可由处理器302执行来提供它们的功能的指令集。在一些实施方式中，组件320、322、324、326、328和/或330中的一个或多个被存储在客户端装置106的存储器304中并且可由处理器302访问和执行来提供它们的功能。在前面的实施方式中的任一个中，这些组件320、322、324、326、328和/或330可以被适配用于与客户端装置106的处理器302和其它组件协作和通信。

图4是示出示例前端渲染引擎110和示例后端渲染引擎120的示例组件之间的交互的图。如上面参考至少图2B和图3B所讨论的，并且如图4中所描绘的，前端(例如，客户端侧)渲染引擎110和后端(例如，服务器侧)渲染引擎120每个包括用于执行各种行为、算法和/或功能的各种组件，但是应该理解，其它配置是可能的，包括例如将前端渲染引擎110的组件(或其行为、算法和/或功能性)中的一些或全部移动到后端渲染引擎120，并且反之亦然，和/或组合前端渲染引擎110和后端渲染引擎120的各种组件或者将它们划分成另外的分立元件。

后端渲染引擎120可以被配置成检索一组内容项(例如，帖子)，将该组内容项组织成初始布局，并且将该组内容项和对应布局发送到前端渲染引擎110以用于渲染和显示给用户。前端渲染引擎110可以接收该组项(例如，帖子)和初始布局并且进一步优化和/或重新配置初始布局以用于显示给用户。对于初始布局中的每个项(例如，帖子)，后端渲染引擎110可以处理表征该内容项的元数据，包括例如但不限于排名、排名弹性、超级帖子候选资格指示器(比特)、可丢弃指示器(比特)、内容项质量的量度、超级帖子质量乘数、排斥测量、模板块、高度估值、固定位置指示器、唯一项id等的元数据，并且存储经处理的元数据以用于由后端渲染引擎120的一个或多个组件快速检索和/或使用以便对其执行它们的行为和/或功能。可以在布局对象424中在后端渲染引擎110的组件之间存储和/或传递内容项(例如，帖子)的元数据。

内容项的(例如，帖子的)排名可以关于其它项将该项的感知值指示给用户。排名可以基于项的内容、用户亲合力、其它社交图特征、其它信号等被预先确定。排名的弹性可以指示给定内容项可能偏离给定排名或分值多远，从而可以被用来确定内容项能够相对于正被显示的其它项被移动多远。在一些实施例中，后端渲染引擎110通过将该项的特性(例如，排名、质量、高度、内容、内容类型等)与要显示的其它项进行比较并且基于项的特性之间的差异或相似性的程度来测量弹性(例如，分配值)来处理给定项的排名弹性测量。在一些情况下，前端渲染引擎110可以有利地使用弹性测量来确定项(例如，帖子)是否可以被重新布置并且它们可以在用于显示的布局的优化期间被从它们的当前位置移除多远。超级帖子候选资格比特可以指示内容项是否能够被提升/变成超级帖子(例如，横跨多个相邻容器)。可丢弃比特可以指示内容项是否能够从正由前端渲染引擎显示丢弃。例如，除非对于给定项包括可丢弃比特，否则前端渲染引擎110可以保存和显示由后端渲染引擎120包括在初始布局中的所有项(例如，帖子)。内容项质量的量度可以指示能够被用来确定该内容项是否可以在大小上缩放的内容项的内容的质量(例如，文本或图像质量等)。超级帖子质量乘数可以指示超级帖子的内容的质量，其可以被用来确定它的感知值、它是否能够被缩放和/或内容项是否应该被提升为超级帖子。某些类型的项(例如，帖子)之间的排斥的量度可以指示应该在项之间维持的最小和/或最大距离。模板块可以包括用于处理、定义并且呈现内容项的指令(例如，标记语言)。对于内容项的高度估值可以由后端渲染引擎120像在本文中别处所讨论的那样计算。固定位置指示器可以指示内容项在初始布局中的固定位置。例如，给定内容项可以被配置成总是出现在初始布局的“左上”位置或“右上”位置处，并且固定位置指示器可以识别该要求。唯一项id可以被用来唯一地识别初始布局中的内容项(例如，帖子)中的每一个。布局对象424能够由后端渲染引擎120和/或前端渲染引擎110用来确定是否以及如何渲染、调整和/或优化内容项的布局。

前端渲染引擎110可以依靠后端渲染引擎120来为内容项(例如，帖子)计算初始布局。例如，包括(初始)布局的表示的布局响应420可以通过从后端渲染引擎120到前端渲染引擎110来提供，并且前端渲染引擎110可以通过在布局内重新布置内容项(例如，帖子)来优化布局和/或一旦它们的实际大小已被渲染就调整项的大小。这是有利的，因为作为技术效果，它能够通过消除二重功能和/或结构来减小系统总体的复杂性。然而，实施方式是可能的并且被其中前端渲染引擎110包括上面参考后端渲染引擎120所讨论的布局操作、结构以及功能中的一些或全部的本公开包含。

在一些实施方式中，前端渲染引擎110可以确定应该基于正被用来查看内容项的视口的大小在布局中使用/激活的相邻容器(例如，列)的数目并且即使已经满足预定阈值也可以响应于触发事件而触发后端渲染引擎120为该组内容项重新确定初始布局。前端渲染引擎110还可以记录在屏幕上每个内容项被渲染在的位置(例如，帖子的左上角的坐标)并且将该信息提供给后端渲染引擎120以用于如上面所描述的处理和机器学习。这具有关于由前端渲染引擎110优化的第一初始布局的优化的结果的信息对于服务器特别是后端渲染引擎120可获得的技术效果。该信息然后可以由服务器特别是后端渲染引擎120用在第二初始布局的后续计算中，所述服务器可能由于所述信息的可用性而实现第二初始布局与第一初始布局相比的进一步改进。因此第二初始布局在相同或另一客户端特别是前端渲染引擎110处的后续优化对于初始布局的优化可能需要更少的资源，因为第二初始布局已经由后端渲染引擎120改进了。

由后端渲染引擎120提供的初始布局可以由布局生成器230与后端渲染引擎120的其它组件(包括例如但不限于多列布局引擎228、流渲染器224、流构建器222、高度估计器226和/或获取活动动作模块220)协作确定。布局生成器230与这些组件相结合可以确定根据一个或多个标准将一组内容项组织成容器的多维(例如，二维)阵列的初始布局。在一些实施方式中，阵列可以包括一系列列或行。例如，在纵向定向中可以按照相邻地位于的列组织内容项并且在横向定向中可以按照相邻地位于的行组织内容项。标准可以包括但不限于它们的估计大小(例如，高度)、大小范围、排名、弹性的量度等。初始布局的非限制性示例在图9中被描绘为902，其在下面被更详细地描述。

布局生成器230可以接收表示并且包括要显示给用户的一组内容项的元数据的布局对象424以及布局配置406(例如，规定视口的像其大小的特性的视口数据)作为输入，并且布局生成器230然后可以基于该输入来对于布局对象424计算布局，并且返回包括所计算的布局的表示的布局响应420。在一些实施方式中，布局生成器230可以与多列布局引擎228协作计算布局。例如，布局生成器230可以经由由多列布局引擎228提供的应用编程接口(API)来管理多列布局引擎228的操作。

布局生成器230可以被配置成基于一个或多个标准(包括但不限于候选资格比特)来确定给定布局对象是否是超级帖子候选。超级帖子包括占用布局区域的超过一个容器(例如，列)的流内容项。在一些实施方式中，超级帖子可以横跨布局的所有可见的相邻容器(例如，列)。可以通过流构建器222(例如，经由流渲染器224和多列布局引擎228)将候选资格比特提供给布局生成器230。流构建器222可以基于内容项的预定排名、对象是否包含嵌入式图像、图像属性(例如，大小、纵横比、分辨率等)是否满足某些参数、它是否不是自身帖子、它是否不是再共享的内容项等来确定候选资格比特。在一些实施方式中，流构建器222可以随着时间的推移而改变超级帖子候选资格比特。例如，如果内容项的属性(包括例如内容项的排名(例如，质量分值))改变，则后端渲染引擎120可以相应地调整候选资格比特以将内容项(例如，帖子)提升为超级帖子候选或者使它从作为超级帖子候选降级。

例如而非限制，为了取得超级帖子候选资格，流构建器222可以被配置成需要内容项具有满足或者超过某个阈值的排名，配置成包括大于或大于1260像素(px)宽的嵌入式照片(如此照片能够被以比较小非超级帖子对象高的分辨率渲染)并且具有从1:2到3:4(高度：宽度)变动的纵横比(如此不必裁剪照片)，配置成不由指定来接收内容项的用户产生，配置成不被其他用户与指定来接收它的用户再共享等。在一些情况下，即使内容项包括具有落在期望范围外(例如，小于1:2)的纵横比的照片，后端渲染引擎120也可以仍然确定它为超级帖子候选(例如，如果内容项具有足够高的排名以具有资格)。对于落在期望范围外的照片，前端渲染引擎110能够对所对应的内容项做出调整，所以满足适当的大小标准(例如，通过在照片周围放置灰色、黑色等)。

作为另一示例而非限制，图11是图示帖子在示例布局内到超级帖子的提升的图。具体地，图11示出布局的在1102之前和在1104之后的阶段，所述布局包括帖子(包括超级帖子(帖子2))可以被放入的区域1106。在阶段1104之后，帖子2被提升为超级帖子并且横跨所有三列以及帖子4、帖子5和帖子1被放入它们最好地适合(例如，基于它们的估计高度)的列。图12是图示基于候选资格的超级帖子的选择和放置的图。在第一阶段1202中，一组帖子(帖子1、帖子2以及帖子3)被确定用于放置在可用区域1208中。在第二阶段1204中，帖子像所示出的那样被放置，但是对于帖子2来说存在适合作为超级帖子或标准帖子的不足空间。在第三阶段1206中，帖子3被提升为超级帖子代替帖子2，所以所有帖子可以适应可用区域1208。可以在前端上稍后优化帖子在阶段1104和阶段1206中的总体高度以移除可能存在于它们之间的任何间隙，所以布局1104的全部项之间的间距可以是一致的。

布局生成器230可以基于给定内容项的候选资格比特来决定是否将它提升为超级帖子。在一些实施方式中，给定对象(例如，帖子)的候选资格比特可能成为指示如果它被转换为超级帖子则对象将有多好的分值乘数。布局生成器230可以被配置成将每个超级帖子候选转换/提升为超级帖子或者配置成为选择性的并且仅选择某些超级帖子候选为超级帖子。例如，布局生成器230可以基于包括例如但不限于用户的视口的大小和/或类型(例如，窗口大小、用户代理等)、布局中的相邻内容的性质、超级帖子将在布局中创建的空白的量、结果布局由于超级帖子而将具有的总体可视要求、对布局内的超级帖子的数目的限制(例如，必须是超级帖子之间的至少两行、每行仅一个超级帖子等)、视口的大小和/或内容限制等的一个或多个标准来转换超级帖子候选。在一些实施方式中，布局生成器230可以基于一个或多个用户相关属性(包括例如但不限于用户的视口规范(例如，屏幕和/或窗口大小、用户代理、带宽等)、简档、社交图、内容偏好等对于第一用户提升超级帖子候选而不对于第二用户提升超级帖子候选。

在一些实施方式中，布局生成器230可以被配置成独立地确定是否转换或提升超级帖子候选或者可以被配置成自动地转换已被提名(例如，有候选资格比特)的每个超级帖子候选。在各种实施方式中，后端渲染引擎120的另一组件(包括例如流构建器222、流渲染器224、多列布局引擎228等)可以通过指定构造器参数、对象、子类等并且将它们传递给布局生成器230来指定超级帖子候选到超级帖子的提升是否是需要的。

在一些实施方式中，布局生成器230可以与多列布局引擎228协作来将超级帖子放置在初始布局中。在一些实施方式中，布局生成器230可以从多列布局引擎228接收布局对象424和布局配置406，并且布局生成器230可以进一步操纵布局(例如，经由多列布局引擎228的API)以提升超级帖子(例如，基于包括在布局对象424中的元数据)。

多列布局引擎228可以被配置成基于对于内容项的大小(例如，高度、宽度等)估值来构建并且扩增对于该组内容项(例如，帖子)的初始布局，所述内容项可以在从流构建器222接收到的布局对象提供。流构建器222可以与应用引擎122交互以接收一组内容项并且然后与高度估计器226协作来估计每个内容项的大小。在一些实施方式中，流构建器222可以被配置成确定与该组内容项相关联的元数据，包括例如如在本文中别处所讨论的排名、弹性、固定位置指示器、唯一项id、超级帖子候选资格比特等。流构建器222可以基于该组内容项和/或元数据来创建串行化的结构化数据(例如，协议缓冲器、XML等)，并且由此将经串行化的结构化数据提供给流渲染器224和/或多列布局引擎228以用于使用。

流渲染器224可以被配置成对于该组内容项(例如，帖子)渲染模板信息以用于由前端渲染引擎110在渲染该组内容项以显示时使用。在一些实施方式中，流渲染器224可以为该组内容项确定模板块(例如，HTML的块)。模板块可以包括对于可以由多列布局引擎228如在本文中别处所讨论的那样进一步操纵的内容项(例如，帖子)中的每一个的通用布局信息(例如，基础容器元素)。流渲染器224可以将模板块包括在布局对象424中并且将该布局对象424向前发送到多列布局引擎228以用于在处理初始布局时使用。

在一些实施方式中，布局生成器230可以通过多列布局引擎228经由API来引导初始布局的处理。为了减小可能需要由前端渲染引擎110在渲染初始布局以显示时执行的优化(例如，重新布置、调整等)的量，多列布局引擎228可以基于该内容项的大小(例如，高度、宽度等)估值将内容项中的每一个放置在初始布局中。要由前端渲染引擎执行的优化的量的减小具有从初始布局开始可以较快地获得用于显示的布局并且此外客户端装置上的较少计算资源有必要获得用于显示的布局的技术效果。多列布局引擎228可以与流渲染器224、流构建器222和/或高度估计器226协作来接收这些估值。在一些实施方式中，流构建器222确定该组内容项并且然后与高度估计器226协作来计算内容项中的每一个的高度的估值。流渲染器224由此然后将大小估值信息提供给多列布局引擎228以用于使用。这是有利的，因为它能够减小在将布局渲染在前端上以显示时优化它所需的时间和努力。

在一些实施方式中，高度估计器226可以基于项的内容、额外内容和/或基于项类型所需的用户界面元素(例如，生日帖子可以包括额外横幅栏)的大小维度、渲染上下文(例如，是否应该包括/显示评论、动作栏、按钮等)、由于组件化而引入的差异、预定改变大小输入、嵌入式媒体的大小维度等中的一个或多个来计算内容项(例如，帖子)的大小维度(例如，高度、宽度)。在一些实施方式中，预定大小输入可以基于要包括在内容项中的内容(例如，作者名＝70px、评论的数目(例如，0、1、2等))。预定大小输入可以取决于内容或平均大小维度来提供一系列大小维度。高度估计器226可以基于媒体属性(例如，包括在报头或关联元数据中)来计算媒体(例如，包括在帖子中的嵌入式照片、视频、地图等)的大小维度(例如，高度、宽度等)。在高度估计器226(例如，由于错误或对于无法辨认的项)也许不能为内容项计算估计的大小维度(例如，高度)的实施方式中，高度估计器226可以遵从预定缺省大小维度(例如，高度)。

多列布局引擎228可以被配置成基于视口大小(例如，浏览器窗口的宽度、列的宽度等)在相邻地位于的容器(例如，列、行)中按照1、2、...、N展开内容项。虽然主要在使用基于列的布局的上下文内描述了本公开，但是它还能够应用于/涵盖具有在至少基于对应的高度测量结果(例如，浏览器窗口的高度、行的高度等)确定的相邻地位于的行中展开的内容项的基于行的布局，或应用于包括行和列两者的三维布局。在一些实施方式中，多列布局引擎228可以包括用于操纵(添加、删除、移动等)正被布置的内容项的API。例如，多列布局引擎228可以包括用于在特定位置处插入内容项的API(例如，这能够由界面设计要求(例如，使特定内容固定在右上或左部角处)驱动)。布局生成器230可以使用API来引导多列布局引擎228的行为。

多列布局引擎228可以被配置成按照排名的顺序(例如，最好到最差、最高到最低等)将该组内容项放置在初始布局中。在一些实施方式中，多列布局引擎228可以被配置成为确定性的(例如，通过布局生成器230)，对于给定的一组内容项和视口意味着，它将生成并且返回基本上相同的布局。

多列布局引擎228可以基于视口大小(例如，浏览器大小、窗口大小等)来确定要在布局中支持的容器(例如，列)的最大数目，和/或容器和内容项的样式属性(例如，CSS类)(例如，宽度、高度等)。在一些实施方式中，可以使用浏览器数据408来确定视口大小。例如，浏览器数据408可以包括指定最后已知视口(例如，浏览器窗口)大小的cookie(例如，zwiebackcookie)。如果多列布局引擎228不能确定视口大小，则多列布局引擎228可以遵从基于正被使用的视口的类型(例如，UserAgent)设定的、硬编码的(例如，在400px下2列缺省值)、基于用户带宽和/或其它标准等设定的容器和大小缺省值。在一些实施方式中，多列布局引擎228可以接收流构建器222可以用来创建布局配置406的布局信息(例如，当前正被显示的列的数目、列宽度等)。多列布局引擎228可以连同浏览器数据408一起或代替浏览器数据408使用该布局配置406。

可以通过多列布局引擎228使用预定顺序(包括例如右到左(RTL)或左到右(LTR))将内容项放置在初始布局的列中。例如而非限制，图10描绘使用三遍LTR放置以填充三列初始布局1002的一组7个布局对象(例如，帖子)。在一些实施方式中，如果列不是基于其估计高度可用的下一个最短列则多列布局引擎228可以跳过一列。例如而非限制，当将另一内容项(例如，帖子8)放置到示例布局1002中时，帖子8将被多列布局引擎228放置在最右列中，因为最右列当前最短，例如，已经包括在中间列中的内容项(例如，帖子2和帖子5)的估计高度超过已经包括在最右列中的内容项(例如，帖子3和帖子6)的估计高度。

获取活动动作模块220可以作为控制器来从前端渲染引擎110接收请求并且向前端渲染引擎110发送响应。在一些实施方式中，获取活动动作模块220可以从流加载器320接收请求可能可用被提供用于加载到用户的内容流中的任何新内容项(例如，帖子)的请求。作为响应，流构建器222与后端渲染引擎120的其它组件协作确定一组内容项和对于这些内容项的初始布局，并且将它们提供给抽象流组件328以用于由前端渲染引擎110进一步处理、优化和显示。

在前端上，为了优化内容项的布局，多列布局引擎322可以确定应该在该布局中显示的容器(例如，列)的数目，可以优化内容项的布局以使容器在每个阵列中的高度基本上相等，可以提升超级帖子，管理超级帖子之间的容器阵列使得它们具有基本上类似的维度(例如，高度)，如果已经满足预定阈值则可以触发初始布局的重新处理。多列布局引擎322可以被耦合成并且配置成与流加载器328、抽象流组件328、响应布局324以及卡片伸展器326直接或间接交互以执行这些行为。

多列布局引擎322可以对卡片做出调整以使包含它们的容器的高度基本上相等。调整可以包括交换布局中的两个或更多个卡片(例如，其显示帖子)的位置并且调整卡片本身的大小。调整的非限制性示例能够包括：向内容片、内容片的子组件以及包含内容片的布局结构添加或减去填充或边缘；修改内容片、内容片的子组件以及包含内容片的布局结构的维度；用附加内容填充布局间隙；在内容片内添加附加内容以增加大小等。作为另一示例而非限制，多列布局引擎322(在一些情况下与卡片伸展器326协作)可以测量渲染的内容片的大小并且以使布局中的未对准和间隙最小化的这样的方式组织它们；识别由布局中的未对准内容片所创建的间隙并且对布局中的一些或所有内容片应用一个或多个不同的调整；重新布置布局中的卡片中的两个或更多个以更紧密地使容器(例如，列、行)的高度或容器的其它维度(例如，x、y、z)相等；处理包括在容器中的内容项的经渲染的/实际的大小并且根据该处理确定内容项中的两个应该交换地点使得容器可以被更紧密地对准等。这些集体调整当被遍及整个布局应用时能够使得布局的各片能够被以在视觉上可处理的方式组织和对准(例如，参见图9)，并且当视口被调整(例如，在接收到视口大小改变事件404后)或新内容被加载到布局中时，可以通过前端渲染引擎120和/或后端渲染引擎110重新处理该布局以做出新调整。

为了调整内容项本身的大小，多列布局引擎322可以与卡片伸展器326交互。内容项在布局内的占位面积有时在本文中被称为卡片。在一些实施方式中，卡片伸展器326可以通过添加填充(例如，沿着卡片的顶部和/或底部)、改变卡片的元素中的一个或多个的大小(例如，高度)(放大文本、添加行间距、添加填充等)、将内容添加到内容项(例如，附加评论、按钮、图像、文本等)等来调整给定卡片的大小(例如，高度)。卡片伸展器可以被配置成基于卡片类型来调整卡片的大小。在一些实施方式中，多列布局引擎322可以通过经由卡片伸展器326对布局的一个或多个内容项做出调整来基本上或完全使初始布局中的列中的全部的总体高度相等。

作为另一示例而非限制，给定卡片是通过将附加填充(例如，垂直的或水平的)包括到各种元素(例如，页脚、页眉、在文本内容与嵌入式对象之间等)来伸展的。例如，在内容项的文本与嵌入式对象之间添加垂直填充(例如，20-50px)。卡片的可伸展方面可以是预定义的且可更新的。在一些实施方式中，多列布局引擎322可以对容器(例如，列元素)应用适当的样式属性并且包括在其中的卡片/内容项可以继承这些样式属性。可以撤销应用于卡片的样式属性，所以可以调整每个卡片(例如，帖子)的大小(例如，高度、宽度)。在一些实施方式中，由多列布局引擎322所使用的卡片伸展器326可以被配置成应用附加样式(例如，CSS类、CSS属性等)以选择性地伸展卡片的各种方面(卡片宽度、卡片高度、卡片内的内容的大小、嵌入式对象宽度、嵌入式对象高度等)。附加地或替选地，卡片伸展器326可以补充卡片的内容(其具体化内容项)以增加它的总体大小。例如，补充可能意在增加被示出的评论的数目。

多列布局引擎322可以被配置成设定样式属性，其可以控制布局的相邻容器(例如，列)的大小(例如，宽度)。在一些实施方式中，多列布局引擎322可以通过响应于接收到触发事件(例如，浏览器大小改变)而设定适当的宽度设定CSS类来设定样式属性。触发事件的非限制性示例可以包括窗口大小调整、页面刷新、定时器、超时、认证令牌期满等。例如，响应布局324可以将视口大小改变事件404提供给多列布局引擎322，并且基于该视口大小改变事件404，多列布局引擎322可以设定要显示的列的数目(例如，通过使用对应的CSS类来激活和或去激活布局的列)。在一些实施方式中，多列布局引擎322可以被配置成确定对于显示(例如，布局)渲染的内容是否基本上横跨整个可查看布局区域，并且如果不是，则可以通过后端渲染引擎120来触发布局的重新确定。另外，多列布局引擎322可以被配置成在触发事件(例如，浏览器大小的改变)超过拐点和/或阈值时触发布局的重新确定。例如，将浏览器窗口的大小从支持单列布局的大小调整到支持三列布局的大小触发后端渲染引擎120重新确定布局。这是有利的，因为它能够减小在前端上执行的处理/优化的量以减小滞后并且给用户提供响应用户体验。

多列布局引擎322可以与响应布局324交互以注册监听这些改变的监听器，并且如果达到了拐点(例如，已经超过了布局支持的列的数目)则能够通过后端渲染引擎120做出调整和/或启动布局的重新确定。响应布局324包括用于注册并且监听命名属性中的改变(例如，浏览器大小改变)的框架。例如，响应布局324可以包括用于注册属性(例如，基于其它从属属性(例如，CSS值)动态地计算属性)、安装触发器(例如，对属性改变注册回调，例如，基于属性添加/移除类)等的功能。

在一些实施方式中，多列布局引擎322可以被配置成在某些流项(例如，帖子、帖子类型等)上支持最大高度。例如，给定内容项可以包括指示最小/最大高度值的元数据，或者内容项的最小/最大值可以被预先确定(例如，作为变量存储在高速缓存中等)。多列布局引擎322可以被配置成以初始布局中的内容项基于内容项的最小/最大高度的放置作基础，并且可以基于相邻列的高度计算来设定适当的最大高度值。

多列布局引擎322可以提升横跨布局的多个容器(例如，列)的一个或多个超级帖子。例如，多列布局引擎322可以提升将高分辨率图像作为超级帖子包含在视口内的内容流的顶上使得它被显著地放置以用于由用户查看的高度相关的内容项。在内容流内包括多个超级帖子的实施方式中，多列布局引擎322能够确保超级帖子之间的列阵列被基本上逐高度对准以向用户提供可视引人入胜的总体布局。在包括超级帖子的实施方式中，布局响应420可以对于在超级帖子之后出现的每组内容项重新开始索引。

多列布局引擎322可以被配置成对于实时更新支持插入。在一些实施方式中，流加载器320可以为新更新而发信号通知获取活动动作模块220，并且作为响应，后端渲染引擎120可以处理任何新的流内容项(例如，帖子)并且获取活动动作模块220然后可以将新的流内容项提供给抽象流组件328以用于布局处理并且加载到用户的内容流中。在一些实施方式中，获取活动动作模块220可以与流加载器320独立地向抽象流组件328推送新的流内容项以用于布局处理并且加载到用户的内容流中。另外的实施方式也是可能的并且被预期到，包括例如其中流加载器320和抽象流组件328被集成到被配置成执行上面指出的行为和/或功能的单个组件中。

为了生成和优化布局，多列布局引擎228和多列布局引擎322皆可以通过构建布局的树结构表示来对布局进行建模。例如，在后端上，多列布局引擎228可以对于节点(例如，帖子)使用模板块来构建树结构，并且在前端上，多列布局引擎322可以构建用于渲染和优化布局的基于DOM的树结构。两个树结构变化可以经由包括但不限于节点的添加、删除和插入等的操作来支持布局的操纵。后端渲染引擎120和前端渲染引擎110的各种其它组件可以分别与布局引擎218和布局引擎322交互(例如，经由API)以操纵和/或检索关于节点的信息，设定布局参数(例如，使列的数目最大化、提升超级帖子等)。

作为另一示例，由多列布局引擎322所构建的内部树结构可以对于要包括在内容流中的内容项中的每一个包括代表性节点。例如，树结构可以包括能够被操纵以修改(例如，移动、删除、添加等)包括在其中的节点的内部HTML文档对象模型(DOM)(例如，内部DOM314)。多列布局引擎322可以按照逻辑顺序对于布局对象424的项导出DOM节点。多列布局引擎322可以耦合到并且与抽象流组件328交互以接收布局对象424。作为另一示例，树结构可以包括识别布局空间的主要容器<div>元素的节点以及列容器<div>元素的子节点的阵列。超级帖子可以作为使子节点的阵列分离(例如，以使上部列阵列和下部列阵列分离)的<div>元素被包括。在一些实施方式中，可以基于该组内容项、布局对象424和/或布局响应420生成这个树结构，所述布局响应420包括从后端渲染引擎120接收到的布局的初始表示。

在一些实施方式中，为了设定布局中的容器(例如，列)的宽度，多列布局引擎228和/或322可以生成样式表信息，包括例如但不限于列容器元素(例如，<div>元素)的CSS类。在一些实施方式中，可以在一个列位置中定义每个可能的列宽度的CSS类，所以它可由前端渲染引擎110和/或客户端应用108容易地访问。这个样式信息可以指示添加到列的每个卡片(包括例如但不限于卡片的空页、卡片的卡片维度、卡片的嵌入式内容等)的宽度。另外，可以在卡片的样式表信息(例如，GSS)中定义如何处理卡片/内容项(例如，示出对话中的更多参与者的附加内容)的方面中的任何改变。

在一些实施方式中，由多列布局引擎322和/或228所执行的布局处理可以考虑用户凝视模式并且排名较高的区域可以被放置在用户往往在消费它们的流内容时首先看到的区域中。例如，用户可以以包括对于第一行的LTR凝视运动和对于内容的第二“行”的RTL凝视运动并且往页面下方重复的向下模式扫描页面。附加地或替选地，用户可能更喜欢可以包括页面的左上部、右上部以及右底部的热“角”。在一些情况下，重度用户可能往往从左向右扫描，但是可以被引向在右角中并且在右侧的内容。当渲染布局时，布局引擎322和/或228可以将排名较高的内容项放置在这些更频繁地查看的区域中以给用户提供更令人满意的体验。在一些实施方式中，用户可以在2列布局中每页看到4个内容项并且对于3列布局每页看到6个内容项，但是其它布置也是可能的并且被预期到。

系统100的附加和/或替选特征和结构可以包括：基于浏览器宽度对于多列布局在多个卡片宽度之间弹出；使得卡片内的某些区域能够为垂直地有弹性的以占用空白空间(例如，在主要内容上方的填充、所示出的原始文本的线的数目(对于截断的内容项)、评论面板的高度与所示出的评论的数目)；使非弹性填充/边缘保持在卡片外部以保持均匀间距；基于用户代理设定列的数目(例如，对于平板来说为1、对于台式机来说为2、对于未知来说为2等)，除非更特定大小的浏览器大小信息可用于用户；不按逻辑/排名顺序放置内容项以适合布局并且使流的可视有效性最大化；在每种类型的布局(例如，共享框、mixin)中使各种内容项在必须出现在预定位置中的流中的放置固定；通过将流区域减小至N-1列来继续支持右手侧边栏和/或内容，其中N＝将在没有右手侧边栏的情况下示出的列的数目；支持聊天花名册(例如，一旦窗口达到某个宽度就固定面板)；提供软流稳定性(例如，给定相同内容和相同浏览器大小，布局的列、超级帖子等的数目应该是相同的)；对于web爬取器以逻辑顺序渲染流；支持键盘和联合用例(例如，对于键盘导航，能够将“下一个”内容项定义为其顶部边是次最高的一个，而不管列如何)；防止流在初始渲染(例如，在进一步用户交互之前呈现的布局)之后的突然中断；提供对于缓存的支持；提供支持服务器侧渲染；支持新内容项宽度、不同的列约束以及对于由应用引擎122所提供的不同服务的不同要求；以及在带宽与分辨率之间使初始图像下载均衡。

虽然图4将各种组件描绘为不同的，但是应该理解，在不脱离本公开的范围的情况下，可以组合、重新组织或者进一步隔离这些组件中的一个或多个。在一些实施方式中，可以将关于前端渲染引擎110所描述的结构、行为和/或功能并入后端渲染引擎120，或者反之亦然。在一些实施方式中，可以将前端渲染引擎110和/或后端渲染引擎120的组件中的一个或多个(或它们的结构、行为和/或功能)组合在一起或者进一步划分成附加组件。

图5是用于自动地确定并且优化多维布局的示例方法500的流程图。在方法500中，流构建器222可以接收一组内容项(例如，帖子)502并且与高度估计器226协作来估计504帖子的大小。例如，每个帖子当被放置在布局的容器(例如，列)中时可以占用某个占位面积(在本文中有时也被称为卡片)。在一些实施方式中，如在本文中别处所讨论的，高度估计器226可以基于卡片/帖子将被放入的容器(例如，列)的宽度、包括在帖子中的内容、帖子的类型等来估计每个卡片/帖子的高度。

接下来，多列布局引擎228可以确定请求了该组帖子的视口的属性506并且可以基于所对应的卡片大小估值和视口属性为该组帖子确定多维布局508。在一些实施方式中，多列布局引擎228可以确定考虑视口的大小中的可能的进一步改变的灵活布局。例如，由布局引擎228所确定的多维布局可以包括包含对应样式表信息的单列、两列、三列等布局选项。前端渲染引擎110可以通过取决于哪一个布局选项是特定视口大小所需的而实现不同样式信息(例如，CSS类)来激活特定布局选项(例如，两列、三列等)。

作为另一示例而非限制，图13和图14是图示多列布局引擎322基于视口大小选择性地确定布局参数和内容布置的灵活性的图。具体地，图13描绘示出了多列布局引擎322可以如何将布局从三列布局1302方便地改变为两列布局1304或者进一步改变为一列布局1306(例如，通过应用所对应的样式表信息)的示例进展1300。图14描绘示出了从三列布局1402到两列布局1404的改变的另一示例进展1400。示例进展1300和示例进展1400示出卡片如何能够被重新布置在活动的列内。例如，参考示例布局1402和示例布局1404，1402具有遍及三个活动列LTR分布的帖子1-4，其中1404具有遍及两个活动列LTR分布的帖子1-4。

返回参考图5，一旦已经确定了用于该组帖子的初始多维布局，多列布局引擎322就然后可以确定帖子的渲染大小510，优化初始布局的维度512，并且然后将用于显示的布局提供给用户(例如，与客户端应用108协作)514。在一些实施方式中，多列布局引擎322可以通过交换包括在布局中的两个或更多个卡片/帖子的位置和/或对卡片/帖子做出大小调整来优化初始布局的维度。多列布局引擎322可以执行该布局优化以使布局中的这些列中的每一个的高度基本上相等，这使得该组帖子的布局看起来一致并且在视觉上对用户引人入胜。附加地和/或替选地，多列布局引擎322可以执行该优化以创建用于放置/提升超级帖子(例如，横跨多个列宽度的帖子)的空间。

作为另一示例而非限制，图9是图示示例初始布局902的优化的图。如所描绘的，多列布局引擎322可以接收初始布局902(如由后端渲染引擎120所渲染和提供的)，可以确定列以及包括在列中的卡片的实际高度(例如，基于包括在DOM中的对应元素(例如，<div>)的高度信息)。使用该信息，多列布局引擎322可以比较列的高度并且确定沿着下边界是否存在任何间隙。在一些实施方式中，因为初始布局902可以基于由高度估计器226所计算的高度估值，所以当渲染帖子以显示时确定的实际高度可以不同于所估计的高度，并且布局的列实际上可以具有与由多列布局引擎228最初确定的大小不同的大小。

为了填充间隙，多列布局引擎322可以将帖子中的两个或更多个重新分布在布局内。例如，在布局904中，帖子1已被移动到由帖子5以前占据的位置，帖子5已被移动到由帖子6以前占据的位置，并且帖子6已被移动到由帖子1以前占据的位置。为了做出大小调整，多列布局引擎322可以与卡片伸展器326协作来通过修改卡片的一个或多个方面来调整卡片的大小。例如，卡片伸展器326可以补充帖子的内容(例如，包括附加评论)或者将填充添加到帖子以调整帖子的总体高度。作为另一示例，在布局906中，帖子6、帖子4、帖子7、帖子5以及帖子9已经由卡片伸展器326通过将内容(例如，附加评论、交互式元素、相关内容等)和/或填充添加到卡片/帖子的页脚而被伸展。在一些实施方式中，多列布局引擎322可以构建DOM(例如，内部DOM314)的内部版本并且卡片伸展器326可以使用由多列布局引擎322所暴露的API来操纵它(例如，移动节点、添加节点、移除节点、修改节点等)。一旦DOM314的内部版本的操纵完成，多列布局引擎322就可以将改变推送给客户端应用108的DOM314，使得可以将改变(例如，优化布局)显示给用户。

类似地，图10是图示示例初始布局的帖子通过多列布局引擎322的重新布置的图。与图9一样，多列布局引擎322可以通过将帖子4-7移动到布局的不同容器(例如，<div>)中来将初始布局1002的帖子重新安排成优化布局1004，并且从而将相邻容器的高度调整为在高度上基本上更相等。多列布局引擎322还可以与卡片伸展器326协作来(通过调整第二列和第三列中的一个或多个卡片的大小)结束列的高度调整，使得它们对于人类用户而言似乎具有相同的高度。在一些实施方式中，列可以具有相同的或基本上相同的如用像素测量的高度(例如，在0-5％内)。

图6是用于优化示例预定初始布局的示例前端方法600的流程图。在方法600的块602中，多列布局引擎322可以从后端渲染引擎120接收初始多列布局。初始多列布局可以由后端多列布局引擎328使用由高度估计器226计算的高度估计来确定。接下来，如在本文中别处所讨论的，多列布局引擎322可以渲染列和内容项(例如，帖子)的高度604并且确定列之间的高度差606。多列布局引擎322然后可以优化布局。例如，多列布局引擎322可以通过重新布置帖子和/或做出大小调整来使列的高度相等608。在一些实施方式中，多列布局引擎322可以计算帖子在列内的放置的各种场景以确定帖子的最佳布置。一旦最佳布局已被确定并且提供给用户以用于由多列布局引擎322显示610，引擎322就可以将优化的布局发送到后端以用于学习612。例如，布局生成器230可以接收优化的布局和/或DOM的当前状态并且将它与初始布局进行比较以确定做出了哪些改变。在数个迭代上使用比较，布局生成器230可以识别由前端渲染引擎110做出的公共调整并且可以适配由布局生成器230和/或多列布局引擎228所使用的布局算法以将来改进由它们所确定的初始布局。

图7是用于确定初始布局的示例后端方法700的流程图。在块702中，流构建器222可以确定一组内容项(例如，帖子)。在一些实施方式中，流构建器222可以与应用引擎122交互以确定该组帖子。例如，应用引擎122可以是社交网络应用并且可以给流构建器222提供一组帖子。接下来，在块704、块706、块708、块710以及块712中，流构建器222可以与其它组件协作确定帖子的估计高度、帖子的排名、排名的弹性量度以及帖子的超级帖子候选资格比特。在一些实施方式中，流构建器222可以通过以元数据的形式从应用引擎122接收信息来确定排名、弹性以及候选资格比特。另外，流构建器222可以通过从高度估计器226接收高度估值来确定帖子的高度。在一些实施方式中，如在本文中别处进一步讨论的，流构建器222可以将各种信息提供给高度估计器226以便它在确定高度估值时使用。

多列布局引擎228然后可以继续对于指定来接收该组帖子的用户确定浏览器数据712并且为初始布局确定列的数目714，以及基于浏览器数据确定由初始布局所支持的列选项的数目。在一些实施方式中，浏览器数据可以包括用户的带宽、视口大小等，多列布局引擎228可以用来确定有多少列要包括在布局中以及是否计算对于布局的多个列选项。例如，对于具有窄带宽并且将很可能被要求等待长时间以接收包括多个列以及重度内容和格式化的页面的用户来说，多列布局引擎228可以将初始布局确定成具有更简单格式以减小传送给该用户的客户端装置106的数据的大小。在另一示例中，如在本文中别处所讨论的，对于有充足带宽的用户来说，多列布局引擎228然后可以基于视口大小来确定要包括在布局中的列和列选项的数目。在一些实施方式中，用户可以将偏好设定成接收布局的低带宽版本。

接下来，布局生成器230可以基于候选资格比特来确定哪些帖子(若有的话)应该被提升为超级帖子716并且可以确定它们在初始布局内的放置718(例如，与多列布局引擎228协作)。在一些实施方式中，前端多列布局引擎322可以撤销由布局生成器230所提升的超级帖子。例如而非限制，如果用户调整他或她正在使用来查看他的或她的内容流的窗口的大小，则多列布局引擎322可以将布局从三列布局切换为一列布局。另外，多列布局引擎322因为超级帖子接近于相邻超级帖子而可能不选择提升它。例如，可以定义需要超级帖子间隔开一定距离或者具有使它们分离的预定量的内容的规则，并且多列布局引擎322可以基于该规则撤销超级帖子的放置。作为另一非限制性示例，布局对象424可以包括具有对于帖子中的两个或更多个指示它们能够被多紧密地放置在给定布局内的排斥指示器的元数据，并且多列布局引擎322可以根据该排斥指示器来优化布局/放置帖子以实现帖子相对于彼此的最佳放置。

在块720中继续，多列布局引擎228可以通过迭代地在下一个最短列中RTL或LTR放置帖子来用非超级帖子帖子扩增布局的列720，并且然后可以将初始布局提供给前端以用于进一步渲染722。

作为另一示例，图16是具有帖子的优化布局的包含内容流1602的示例用户界面1600的图形表示。内容流1602包括横跨内容流1602的全部列的超级帖子1608的示例。超级帖子1608将布局划分成两个列阵列1606和列阵列1610。每个列阵列1606和列阵列1610可以通过系统100像在本文中别处更详细地讨论的那样展开和优化，使得帖子对于用户而言看起来在相等高度的列中被一致地隔开和放置。在一些实施方式中，帖子中的一个或多个(例如，帖子1604)可以是被系统100总是放置在布局的相同位置中的固定放置帖子。

图8是用于将新内容项(例如，帖子)加载到内容流中的示例方法800的流程图。在块802中，抽象流组件328可以通知用户新帖子可用于查看，并且作为响应，可以接收用于加载新帖子的触发器804。在加载新帖子之前，抽象流组件328可以向书签模块330发送信号以标记用户在视口内的当前位置806。抽象流组件328然后可以使得能够将新帖子加载到布局中808。在一些实施方式中，抽象流组件328可以像在本文中别处所讨论的那样从获取活动动作模块220接收新帖子的通知并且然后可以与多列布局引擎322协作来优化用于这些帖子的布局。在一些实施方式中，可以使用在本文中别处所讨论的功能来将新帖子放置到几乎相等大小的列中。接下来，书签模块330可以滚动到新近加载的帖子的位置使得用户能够查看它们810。在一些实施方式中，可以在用户的内容流的顶上加载新帖子。书签模块330然后可以显示用于将用户返回到书签位置以在用户在加载了新帖子之前留在的地方继续的选项。作为响应，书签模块330可以接收用户对选项的选择816并且然后将页面滚动到书签位置818。

作为另一示例，图15A和图15B是用于查看实时地加载到内容流1502中的新内容项(例如，帖子)的示例用户界面1500的图形表示。内容流1520包括横跨内容流1502的全部列的超级帖子1504的示例。如所描绘的，用户界面1500可以包括用于将新帖子加载到用户的内容流1502中的按钮1506。对该按钮1506的选择可以滚动到如图15B中所描绘的新帖子被插入(例如，RTL或LTR等)和/或调整所在的内容流1502的顶部。另外，参考图15B，用户界面1500可以包括可由用户选择来返回到在被滚动到内容流1502的顶部之前他或她所在的位置的书签按钮1514。图15B中所示出的帖子是被插入到内容流1502中的新帖子的示例。

应该理解，图9至图16中所示出的用户界面、内容流、按钮、布局、帖子以及其它元素的格式通过示例来提供，并且在这些用户界面中显示的信息和元素不限于任何特定类型或大小，并且其它变化被预期。例如，可以生成与像包括在各种手持移动装置(例如，移动电话)中的那些的较小屏幕大小兼容的用户界面。而且，由系统100渲染的布局和用户界面可以具有各种不同的格式、内容以及窗口内的位置和组合，其中的全部被本公开的范围包含。

描述了包括自动地对准多维布局的技术。在上述描述中，出于说明的目的，阐述了许多特定细节以便提供对本公开的彻底理解。然而，应该理解，能够在没有这些特定细节的情况下实践本文中所描述的系统、方法以及计算机产品。在其它实例中，结构和装置用框图形式示出以便避免使本公开混淆。例如，上面参考用户界面和特定硬件在一些实施方式中描述了各种组件、操作和/或特征。然而，本公开适用于能够接收数据和命令的任何类型的计算装置以及提供服务的任何外围装置。

在本公开中对“一个实施方式”、“实施方式”、“一些实施方式”等的引用意味着结合该实施方式描述的特定特征、结构或特性被包括在至少一个实施方式中。短语“在一个实施方式中”或“在一些实施方式中”在公开内的各种地方中的出现未必全部参考相同的实施方式。

以上的详细描述的某些部分是按对计算机存储器内的数据比特的操作的算法和符号表示来呈现的。算法在这里并且通常被设想为导致期望结果的步骤的自一致序列。步骤是需要物理量的物理操纵的那些。通常，尽管未必，但是这些量采取能够被存储、传送、组合、比较以及以其它方式操纵的电信号或磁信号的形式。主要由于公共使用的原因，将这些信号称为比特、值、元素、符号、字符、项、数字等有时已证明是方便的。

然而，应该牢记，这些和类似项中的全部将与适当的物理量相关联并且仅仅是应用于这些量的方便标签。除非如从上述讨论显而易见的那样另外具体地陈述，否则应当了解贯穿本描述，利用包括例如“处理”或“计算”或“运算”或“定义”或“识别”或“确定”或“显示”等的术语的讨论指代计算机系统或类似的电子计算装置的动作和过程，所述计算机系统或类似的电子计算装置将表示为计算机系统的寄存器和存储器内的物理(电子)量的数据操纵并且变换成类似地表示为计算机系统存储器或寄存器或其它这样的信息存储、传输或显示装置内的物理量的其它数据。

本公开还涉及用于执行本文操作的设备。这个设备可以是为所需目的而具体地构造的，或者它可以包括由存储在计算机中的计算机程序选择性地激活或者重新配置的通用计算机。这样的计算机程序可以被存储在计算机可读存储介质中，所述计算机可读存储介质包括例如每个耦合到计算机系统总线的包括软盘、光盘、CD-ROM以及磁盘的任何类型的盘、只读存储器(ROM)、随机存取存储器(RAM)、EPROM、EEPROM、磁或光学卡、包括带非易失性存储器的USB密钥的闪速存储器或适合于存储电子指令的任何类型的介质。

本公开能够采取全硬件实施方式、全软件实施方式或包含硬件元素和软件元素两者的实施方式的形式。在优选实施方式中，本公开用软件实现，所述软件包括但不限于固件、驻留软件、微码等。

此外，本公开能够采取可从提供程序代码以用于由计算机或任何指令执行系统使用或者连同计算机或任何指令执行系统一起使用的计算机可用或计算机可读介质访问的计算机程序产品的形式。出于本描述的目的，计算机可用或计算机可读介质可以是能够包含、存储、通信、传播或者传输程序以用于由指令执行系统、设备或装置使用或者连同指令执行系统、设备或装置一起使用的任何设备。

适合于存储和/或执行程序代码的数据处理系统将包括通过系统总线直接或间接耦合到存储器元件的至少一个处理器。存储器元件能够包括在程序代码的实际执行期间采用的本地存储器、大容量存储、以及提供至少一些程序代码的暂时存储以便减小在执行期间必须从大容量存储中检索代码的次数的高速缓存存储器。

输入/输出或I/O装置(包括但不限于键盘、显示器、指示装置等)能够直接或通过中间I/O控制器耦合到系统。

网络适配器还可以耦合到系统以使得数据处理系统能够变得通过中间专用或公用网络耦合到其它数据处理或远程打印机或存储装置。调制解调器、电缆调制解调器以及以太网卡只是当前可用类型的网络适配器中的几个。

最后，本文中所呈现的算法和显示不固有地与任何特定计算机或其它设备有关。各种通用系统可以根据本文教导与程序一起使用，或者将更专门的设备构造成执行所需要的方法步骤可能证明是方便的。各种这些系统所需要的结构将从以上描述出现。此外，未参考任何特定编程语言对本公开进行描述。应当了解，各种编程语言可以被用来实现如本文中所描述的本公开的教导。

已经出于图示和描述的目的呈现了本公开的实施方式的前面描述。它不旨在为详尽的或者将本公开限于所公开的精确形式。鉴于上述教导许多修改和变化是可能的。意图是，本公开的范围不受此具体实施方式限制，而是相反由本申请的权利要求限制。如本领域的技术人员将理解的，在不脱离本公开的精神或必要特性的情况下，本公开可以以其它特定形式加以具体化。同样地，模块、例程、特征、属性、方法学以及其它方面的特定命名和划分不是强制的或重要的，并且实现本公开或其特征的机制可以具有不同的名称、划分和/或格式。此外，应该理解，本公开的例程、特征、属性、方法学以及其它方面能够作为软件、硬件、固件或这三者的任何组合被实现。并且，在本公开的组件(其示例是模块)作为软件被实现的情况下，该组件能够作为独立程序、作为较大程序的一部分、作为多个单独的程序、作为静态或动态链接库、作为内核可加载模块、作为装置驱动器和/或以每个和任何其它方式被实现。另外，本公开绝不限于采用任何特定编程语言或对于任何特定操作系统或环境的实施方式。因此，本公开旨在说明但不限制所附权利要求中所阐述的主题。

Claims (21)

1.一种计算机实现的方法，包括：

为内容流确定多个内容项；

对于所述内容项估计大小维度；

为所述内容项确定基于所述大小维度将所述内容项放置到两个或更多个相邻容器中的多维布局；

确定所述两个或更多个相邻容器之间的大小差；以及

调整所述内容项中的一个或多个的方面以使所述两个或更多个容器的大小基本上相等。

2.根据权利要求1所述的计算机实现的方法，其中，调整所述内容项中的所述一个或多个的所述方面包括在所述两个或更多个相邻容器之间交换所述内容项中的两个或更多个。

3.根据权利要求2所述的计算机实现的方法，其中，在所述两个或更多个相邻容器之间交换所述内容项中的两个或更多个包括确定对于所述两个或更多个内容项中的每一个的排名弹性测量满足预定阈值。

4.根据权利要求3所述的计算机实现的方法，其中，调整所述内容项中的所述一个或多个的所述方面包括调整所述内容项中的所述一个或多个的高度。

5.根据权利要求1至4中的一项所述的计算机实现的方法，进一步包括：

为被指定为显示所述内容流中的所述多个内容项的视口确定视口属性；以及

基于所述视口属性为所述多维布局确定列的数目，其中，所述两个或更多个相邻容器中的每一个表示所述多维布局的列。

6.根据权利要求1至5中的一项所述的计算机实现的方法，进一步包括：

渲染所述两个或更多个相邻容器；以及

基于所述渲染为所述两个或更多个相邻容器中的每一个确定高度，其中，所述两个或更多个相邻容器中的每一个表示所述多维布局的列并且确定所述两个或更多个相邻容器之间的大小差包括比较所述两个或更多个相邻容器中的每一个的高度。

7.根据权利要求1至6中的一项所述的计算机实现的方法，进一步包括：

处理优化的布局以改进将来的多个内容项在将来的多维布局中的放置。

8.一种包括包含计算机可读程序的计算机可用介质的计算机程序产品，其中，所述计算机可读程序当在计算机上执行时使所述计算机：

为内容流确定多个内容项；

对于所述内容项估计大小维度；

通过基于所述大小维度将所述内容项放置到两个或更多个相邻容器中来确定多维布局；

确定所述两个或更多个相邻容器之间的大小差；以及

调整所述内容项中的一个或多个的方面以使所述两个或更多个容器的大小基本上相等。

9.根据权利要求8所述的计算机程序产品，其中，调整所述内容项中的所述一个或多个的所述方面包括在所述两个或更多个相邻容器之间交换所述内容项中的两个或更多个。

10.根据权利要求9所述的计算机程序产品，其中，在所述两个或更多个相邻容器之间交换所述内容项中的两个或更多个包括确定对于所述两个或更多个内容项中的每一个的排名弹性测量满足预定阈值。

11.根据权利要求10所述的计算机程序产品，其中，调整所述内容项中的所述一个或多个的所述方面包括调整所述内容项中的所述一个或多个的高度。

12.根据权利要求8至11中的一项所述的计算机程序产品，其中，所述计算机可读程序当在所述计算机上执行时进一步使所述计算机：

为被指定为显示所述内容流中的所述多个内容项的视口确定视口属性；以及

基于所述视口属性为所述多维布局确定列的数目，其中，所述两个或更多个相邻容器中的每一个表示所述多维布局的列。

13.根据权利要求8至12中的一项所述的计算机程序产品，其中，所述计算机可读程序当在所述计算机上执行时进一步使所述计算机：

渲染所述两个或更多个相邻容器；以及

基于渲染为所述两个或更多个相邻容器中的每一个确定高度，其中，所述两个或更多个相邻容器中的每一个表示所述多维布局的列并且确定所述两个或更多个相邻容器之间的大小差包括比较所述两个或更多个相邻容器中的每一个的高度。

14.根据权利要求8至13中的一项所述的计算机程序产品，其中，所述计算机可读程序当在所述计算机上执行时进一步使所述计算机：

处理优化的布局以改进将来的多个内容项在将来的多维布局中的放置。

15.一种系统，包括：

处理器；以及

存储指令的存储器，所述指令当被执行时使所述系统：

为内容流确定多个内容项；

对于所述内容项估计大小维度；

通过基于所述大小维度将所述内容项放置到两个或更多个相邻容器中来确定多维布局；

确定所述两个或更多个相邻容器之间的大小差；以及

调整所述内容项中的一个或多个的方面以使所述两个或更多个容器的大小基本上相等。

16.根据权利要求15所述的系统，其中，调整所述内容项中的所述一个或多个的所述方面包括在所述两个或更多个相邻容器之间交换所述内容项中的两个或更多个。

17.根据权利要求16所述的系统，其中，在所述两个或更多个相邻容器之间交换所述内容项中的两个或更多个包括确定对于所述两个或更多个内容项中的每一个的排名弹性测量满足预定阈值。

18.根据权利要求17所述的系统，其中，调整所述内容项中的所述一个或多个的所述方面包括调整所述内容项中的所述一个或多个的高度。

19.根据权利要求15至18中的一项所述的系统，其中，所述指令当被执行时进一步使所述系统：

为被指定为显示所述内容流中的所述多个内容项的视口确定视口属性；以及

基于所述视口属性为所述多维布局确定列的数目，其中，所述两个或更多个相邻容器中的每一个表示所述多维布局的列。

20.根据权利要求15至19中的一项所述的系统，其中，所述指令当被执行时进一步使所述系统：

渲染所述两个或更多个相邻容器；以及

基于渲染为所述两个或更多个相邻容器中的每一个确定高度，其中，所述两个或更多个相邻容器中的每一个表示所述多维布局的列并且确定所述两个或更多个相邻容器之间的大小差包括比较所述两个或更多个相邻容器中的每一个的高度。

21.根据权利要求15至20中的一项所述的系统，其中，所述指令当被执行时进一步使所述系统：

处理优化的布局以改进将来的多个内容项在将来的多维布局中的放置。