Tag: Jetpack

Get Peak WordPress Performance with Jetpack

The irony of web performance is that the average page weight of a site continues to go up year after year, despite us being more aware of the problem and having more tools at our disposal to fight it than ever.

To paraphrase Seinfeld, “we know how to fight page weight issues; we just don’t use the tools we have to fight page weight issues.”

That’s why Jetpack provides powerful features for all users at any plan level. They made it so that performance is integrated right into managing content on a WordPress site.

One of those things is lazy loading images. Lazy loading is an excellent technique to defer loading images until they are actually needed. So, an image never loads until the user actually scrolls to where it comes into display. That could potentially save a ton of server requests and precious bytes when waiting for a page to load. Jetpack includes lazy loading, even on free plans, so everyone has access to this performance boost.

And what’s the point of lazy loading anything if you don’t have somewhere to host the files? Well, Jetpack also offers unlimited static file and image hosting for every plan level. No more wondering how much storage is left on your server! You get an unlimited amount of space to store anything you need. That’s pretty awesome!

It gets even more awesome. That’s because the unlimited storage is part of a CDN that is designed to serve images from high-speed dedicated data centers that make downloads as fast and smooth as possible. Again, that’s free to everyone!

That makes Jetpack a super resource for combatting performance issues on a WordPress site. Hey, we use Jetpack here at CSS-Tricks and it’s a linchpin for so much of how this site works and operates. The performance benefits are a nice perk but it’s worth checking out everything it has to offer because there’s likely so much more you can leverage.

Get Jetpack

The post Get Peak WordPress Performance with Jetpack appeared first on CSS-Tricks.

CSS-Tricks

, , ,

Using Jetpack to Accelerate WordPress Development

(This is a sponsored post.)

[Geoff:] I’ve built a fair number of WordPress sites in my day. It’s been my go-to since the 2.x-ish days because it works for any site, big or small. That’s the sort of solution and flexibility you like to have as a freelancer.

Boy, I wish I had Jetpack available in those early days.

Like WordPress itself, Jetpack is a good solution for many, many of the types of things clients are looking for from a WordPress site. I used to spend hours researching the right plugin for a specific feature, whether that was for comment filtering, asset caching, beefier search functionality, creating custom post types on the fly… you name it. All of that — and a heckuva lot more — is included in Jetpack right out of the box.

Here’s what I’m talking about. A friend of mine runs a pop-up gallery here locally. She displays paintings, photographs, sculptures… basically anything super artsy from super talented locals. That includes events, socials, performances and screenings. The wild thing is that it “pops” up in different spots, based on what she’s showing and what public space is available. So, you get how a website would be helpful for visitors to keep tabs on what’s coming up and where things are going to take place, not to mention getting a recap on past events.

We’ve all made sites for friends, right? It’s the kind of thing you do for free on the side. That makes it something you want to do well, but not necessarily spend a ton of time making. That’s where Jetpack really helped me out in this case.

If Jetpack is new to you, it’s a WordPress plugin that, as part of what it does, is bring features from WordPress.com and makes them available on your self-hosted WordPress sites.

For example, my friend really needed to showcase work. This is less of a content site and more of a visual experience, so media plays a big role. Photos, video, audio. You get it. Good thing Jetpack has a “Portfolio” custom post type at the ready.

That’s a perfect start for showing things off, but my friend also needed a carousel to allow visitors to browse photos from events and artist works. This would’ve been something I probably would have turned to the WordPress plugin directory for in the past, or perhaps some (back then) jQuery plugin, but thankfully Jetpack had my back there, too.

While we’re on the topic of media, we know that heavy image files are a recipe for slow sites. There’s a ton of WordPress plugins that can help with caching, gzipping, and even lazy loading, but all that’s already in Jetpack. Why go reinvent the wheel, especially on what’s supposed to be a pretty quick build?

I think you catch my drift. The fact is that Jetpack is an effective way to supercharge a self-hosted WordPress site, connecting it to many of the same powerful services that you’d otherwise need to go to WordPress.com — or gobs of third-party plugins — to get. Plus, it’s built by Automattic, so you know it integrates seamlessly with WordPress. No better confidence than going with something the primary maintainers of WordPress are willing to slap their name on!

Sure, we’ve only looked at a very simple example of how powerful Jetpack is for a small site. But don’t be fooled: Jetpack is capable of handling the needs of large-scale sites as well. In fact, we love Jetpack here at CSS-Tricks because it powers so much of what you see on the site, from social sign-in and automated sharing, to downtime monitoring and site search. It’s robust, dependable, and just gosh darn delightful to use.

And, hey, there’s a free tier you can start using right away and it includes a generous number of features that help with security, performance, analytics, and theming… and it only goes up from there. 🚀

Get Jetpack

Direct Link to ArticlePermalink

The post Using Jetpack to Accelerate WordPress Development appeared first on CSS-Tricks.

CSS-Tricks

, , , ,
[Top]

Jetpack Gutenberg Blocks

I remember when Gutenberg was released into core, because I was at WordCamp US that day. A number of months have gone by now, so I imagine more and more of us on WordPress sites have dipped our toes into it. I just wrote about our first foray here on CSS-Tricks and using Gutenberg to power our newsletter.

Jetpack, of course, was ahead of the game. Jetpack adds a bunch of special, powerful blocks to Gutenberg that it’s easy to see how useful they can be.

Here they are, as of this writing:

Maps! Subscriptions! GIFs! There are so many good ones. Here’s a look at a few more:

The form widget, I hear, is the most popular.

You get a pretty powerful form builder right within your editor:

Instant Markdown Processing

Jetpack has always enabled Markdown support for WordPress, so it’s nice that there is a Markdown widget!

PayPal Selling Blocks

There is even basic eCommerce blocks, which I just love as you can imagine how empowering that could be for some folks.

You can read more about Jetpack-specific Gutenberg blocks in their releases that went out for 6.8 and 6.9. Here at CSS-Tricks, we use a bunch of Jetpack features.

The post Jetpack Gutenberg Blocks appeared first on CSS-Tricks.

CSS-Tricks

, ,
[Top]

CSS-Tricks Uses Jetpack

(This is a sponsored post.)

Hey! I made a little page to explain all the ways in which this very site uses the Jetpack WordPress plugin.

Here’s the gist of it:

  • Our Jetpack subscription gives us VaultPress, which backs up literally everything on this site in real time. That helps me sleep.
  • Jetpack improves our site search and allows it to be tweaked and the design customized.
  • Jetpack connects to Twitter and Facebook, so as we publish posts it can kick out tweets and updates.
  • Jetpack allows us to author content in Markdown (and you to comment in Markdown).
  • Jetpack adds social login buttons to the comment form, so you don’t have to be troubled to type out your name and email.
  • We display related posts on articles, and Jetpack does a crack job of it without stressing out our server.

But Jetpack has way more features than that. That’s just what we use, what you might find useful for your site could be totally different.

Direct Link to ArticlePermalink

The post CSS-Tricks Uses Jetpack appeared first on CSS-Tricks.

CSS-Tricks

, ,
[Top]