dell perch330

tech2023-03-02 104

dell perch330

While WordPress might have the most users, an increasing number of designers and developers are beginning to explore alternatives. One solution that's growing in popularity is Perch.

尽管WordPress可能拥有最多的用户，但越来越多的设计师和开发人员开始探索替代方案。 Perch是一种越来越流行的解决方案。

I run a web studio in Brighton in the UK dealing mainly with smaller projects. Perch has always been our CMS of choice. Now, with the introduction of Perch Runway and the imminent arrival of Perch Shop, it works for bigger projects too.

我在英国的布莱顿经营一个网络工作室，主要处理较小的项目。 Perch一直是我们的CMS选择。现在，随着Perch跑道的引入和Perch Shop即将到来，它也适用于较大的项目。

Perch is more expensive than open-source alternatives, and Perch Runway isn't that much cheaper than the likes of Craft or ExpressionEngine. It has fewer plugins, and doesn't (yet) have the community of a WordPress or a Drupal (though it does have a very active and supportive community, including very helpful support from the creators themselves). So what makes it such an attractive proposition?

Perch比开源替代品更昂贵，Perch Runway并不比Craft或ExpressionEngine便宜很多。它具有较少的插件，并且(还)没有WordPress或Drupal社区(尽管它确实具有非常活跃和支持性的社区，包括来自创作者本身的非常有用的支持)。那么，什么使它如此具有吸引力呢？

使用方便 (Ease of Use)

Like most designer/developer types, for years I built sites with WordPress. My work flow went something like this:

像大多数设计师/开发人员类型一样，多年来，我使用WordPress构建网站。我的工作流程如下：

download and setup WordPress

下载并设置WordPress

install Bones

安装骨骼

spend the next x amount of time reverse engineering my design to make it work in WordPress.

花下x倍的时间对我的设计进行反向工程，以使其在WordPress中工作。

Sound familiar?

听起来有点熟？

(The process was always similar with Drupal, but you can replace Bones with something like Zen.)

(该过程始终与Drupal相似，但是您可以使用Zen之类的东西替换Bones。)

Perch works differently. Themes are an alien concept in Perch. You build your templates with HTML, CSS and JS, as if it was a static site. Then add the Perch runtime:

鲈鱼的工作方式不同。在Perch中，主题是一个陌生的概念。您可以使用HTML，CSS和JS构建模板，就像它是一个静态站点一样。然后添加Perch运行时：

<?php include('runtime.php');?>

Then you can replace editable regions with simple PHP tags and you're away. So, at the most basic level, here's a before and after:

然后，您可以用简单PHP标记替换可编辑区域，而您就离开了。因此，在最基本的层面上，这是之前和之后：

Once you've made these changes, you can assign an HTML template to the region you've just created ('Main content'). In the above example, we'd probably just want a predefined text block template. Once that's done, and you've input your content, the HTML rendered in the browser is exactly the same as your original HTML file. No surprise tags, classes, scripts or meta data.

进行这些更改后，您可以将HTML模板分配给刚创建的区域(“主要内容”)。在上面的示例中，我们可能只需要预定义的文本块模板。完成此操作并输入内容后，浏览器中呈现HTML与原始HTML文件完全相同。没有惊喜的标签，类，脚本或元数据。

可配置的 (Configurable)

The above example is a little unrealistic, though. Let's say our site has a carousel of images, and our HTML needs to look something like this:

但是，上面的示例有点不现实。假设我们的网站有一个轮播图片，而我们HTML需要看起来像这样：

<ul class="carousel"> <li> <img src="img_1.jpg" alt="Brighton Beach" /> <h2>My local Beach</h2> </li> <li> <img src="img_2.jpg" alt="Aeropress" /> <h2>My Coffee Maker</h2> </li> <li> <img src="img_3.jpg" alt="Hugo and Jude" /> <h2>My Children</h2> </li> </ul>

In WordPress, we'd either hunt down and reverse engineer an existing plugin, or spend half an hour building a custom post type. In Drupal, we'd maybe use Views. But Perch works differently.

在WordPress中，我们要么寻找现有的插件并对其进行反向工程，要么花半小时来构建自定义帖子类型。在Drupal中，我们可能会使用Views。但是Perch的工作方式有所不同。

In this example, we'd add a region to our page:

在此示例中，我们将在页面中添加区域：

<?php perch_content('Carousel'); ?>

We'd then make our own template, using exactly the HTML we require, and replacing the bits that are editable with easy-to-read Perch tags. So, in its most simple form, the above example would become:

然后，我们将使用所需HTML来制作自己的模板，并使用易于阅读的Perch标签替换可编辑的位。因此，以最简单的形式，上面的示例将变为：

<perch:before> <ul class="carousel"> </perch:before> <li> <img src="<perch:content type="image" id="image" label="Image" />" alt="<perch:content type="text" id="alt" label="Description" />" /> <h2><perch:content type="text" id="title" label="Image Title" /></h2> </li> <perch:after> </ul> </perch:after>

Once we've input the relevant content into Perch, the HTML rendered is exactly the same as our original.

将相关内容输入到Perch中后，呈现HTML与我们的原始HTML完全相同。

The ability to create new regions and templates on the fly makes building HTML components quick and easy. Those coming from a developer background can also be reassured that these clean and well structured HTML files are mirrored in the database—but more on that later.

动态创建新区域和模板的能力使构建HTML组件变得快速而轻松。那些来自开发人员背景的人也可以放心，这些干净且结构良好HTML文件已镜像到数据库中，但以后会更多。

快如闪电 (Lightning-fast)

Unless you've been sitting under a Drupal shaped bus for the past few years, you'll know that performance is now a big deal. Google cares, and users care, so you should care too. If implementing a carousel involves installing three plugins or modules or whatever they're called in your CMS of choice, that is going to affect load times, and it's going to affect how much your audience (humans and robots) like you.

除非过去几年一直坐在Drupal形状的公共汽车下，否则您会知道性能现在很重要。 Google很关心，用户也很关心，所以您也应该关心。如果实施轮播涉及安装三个插件或模块，或者在您选择的CMS中调用它们的方式，那么这将影响加载时间，并会影响像您这样的受众(人类和机器人)。

There's none of that bloat with Perch. And changes made earlier this year mean that Perch sends those crucial first bytes of data faster than any other CMS I've ever worked with, including entirely bespoke ones I've painstakingly (and in hindsight foolishly) crafted myself.

珀奇(Perch)没有那么膨胀。而且，今年早些时候进行的更改意味着Perch发送这些至关重要的第一字节数据的速度比我曾经使用过的任何其他CMS都要快，包括我精心打造(完全是事后看来)精心打造的完全定制的CMS。

Let's put some numbers on this. We recently published a site for a tech company in the UK. The home page loads two different partials (one for the header and one for the footer), it has a carousel and six different editable regions. There's no caching, or any other clever business like that, and the TTFB is around 50ms:

让我们对此加一些数字。我们最近在英国为一家科技公司发布了一个网站。主页加载两个不同的部分(一个用于页眉，一个用于页脚)，它具有轮播和六个不同的可编辑区域。没有缓存或类似的任何其他聪明的事情，并且TTFB大约为50ms：

可扩展的 (Extensible)

Calling Perch a “CMS” is a bit of fib, to be honest. The content management part is fine, but it's the system bit I take issue with. Perch is more of a content management toolkit. It stores data for you in a logical structure, and then allows you to do what you like with it.

老实说，将Perch称为“ CMS”有点麻烦。内容管理部分很好，但这是我遇到的系统问题。 Perch更像是内容管理工具包。它以逻辑结构为您存储数据，然后允许您使用它来做自己喜欢的事情。

Let's take the above example. What if we want to be a bit more adventurous, and a simple list of files doesn't quite suffice. Let's say we want our gallery as a JSON file? That's simple enough with a few tweaks from the ever helpful docs and a new template:

让我们来看上面的例子。如果我们想冒险一点，并且仅列出文件就不够了。假设我们想将图片库作为JSON文件？通过对有用的文档和新模板进行的一些调整，这非常简单：

<perch:before>{</perch:before> [ {"image":"<perch:content type="image" id="image" label="Image" jsonencode="true" />", "description":"<perch:content type="text" id="alt" label="Description" jsonencode="true" />", "title":<perch:content type="text" id="title" label="Image Title" jsonencode="true" /> <perch:if exists="perch_item_last">}]<perch:else />}],</perch:if> <perch:after>}</perch:after>

Or what if we just want the content as an array? Or want to filter only the images of my mischievous children? Or get the one most recent item?

或者，如果我们只希望将内容作为数组呢？还是只想过滤我顽皮孩子的图像？还是得到最新的一件？

All these tasks are super simple with Perch. Instead of using perch_content() on our page, we just need to use perch_content_custom()—which takes an array of options, allowing us to filter and manipulate the content stored by Perch.

使用Perch，所有这些任务都非常简单。不用在页面上使用perch_content() ，我们只需要使用perch_content_custom() ，它带有一系列选项，允许我们过滤和操作Perch存储的内容。

鲈鱼跑道 (Perch Runway)

As mentioned, Perch really shines on small to medium projects. Being based on a file system, it's not ideal for very large projects. That's where its bigger sibling, Perch Runway, comes in.

如前所述，Perch确实适用于中小型项目。由于基于文件系统，因此对于大型项目而言并不理想。那是它的更大的同伴Perch Runway出现的地方。

In my head, Runway sits alongside CMSs like Craft and ExpressionEngine. It has high-spec features like Varnish and CDN support, Cloud storage, collections (similar to ExpressionEngine “channels” or “section” in Craft), and it has dynamic routing—which is pretty essential once you get beyond a small number of pages on a site.

在我的脑海中，Runway与Craft和ExpressionEngine等CMS并驾齐驱。它具有高规格功能，例如Varnish和CDN支持，云存储，集合(类似于Craft中的ExpressionEngine“通道”或“分区”)，并且具有动态路由-一旦您访问少量页面，这就非常重要在网站上。

Back when I was working with ExpressionEngine, I ended up using lots of third-party add-ons, which always felt strange and gave me the heebie-geebies. With Perch, the first-party add-ons are almost always enough; and if not, building a Perch app yourself really isn't that daunting.

以前，当我使用ExpressionEngine时，我最终使用了很多第三方加载项，这些加载项总是让我感到很奇怪，并且给了我heebie-geebies 。使用Perch，第一方插件几乎总是足够；如果不是这样，那么自己构建Perch应用程序确实不那么令人生畏。

For studios like mine that work on small and large projects, the combination of Perch and Perch Runway means we only have to master one tool, whatever the problem. That's the USP for me. Just as I wouldn't want to switch code editors depending on a project's size, I don't want to have switch CMSs for the same reason.

对于像我的这样从事小型项目和大型项目的工作室，Perch和Perch Runway的结合意味着无论出现什么问题，我们都只需要掌握一种工具即可。那就是我的USP 。正如我不想根据项目的大小切换代码编辑器一样，出于相同的原因，我也不想切换CMS。

还有一件事 … (One More Thing …)

In the course of this article, I've barely mentioned the CMS itself. It's well structured, fast and easy to use. In five years, I think I've written one manual (for a client who really shouldn't be allowed near a computer). In the words of a recent client—

在本文的过程中，我几乎没有提到CMS本身。结构合理，快速且易于使用。五年来，我想我已经写了一本手册(对于真正不应该被允许坐在电脑旁的客户)。用新客户的话来说 -

The CMS is an absolute dream! I don't think I gave it or you enough love when I first saw it. It is incredible.

CMS是绝对的梦想！当我第一次看到它时，我认为我给的还是您的爱都不够。不可思议。

Clients love the CMS. Developers love the performance. Front-enders love that it doesn’t screw their HTML. All in all, Perch is terrific.

客户喜欢CMS。开发人员喜欢这种性能。前者喜欢它不会破坏HTML。总而言之，Perch很棒。

If you have any questions about Perch, or experiences to share, please post a comment below.

如果您对Perch有任何疑问或需要分享的经验，请在下面发表评论。

翻译自: https://www.sitepoint.com/building-lightning-fast-extensible-websites-with-perch-cms/

dell perch330