What is the Web Animations API?

In the context of web apps, animation is nothing more than the visualization of change over a specified duration. This visualization of change is very important because when done right we can use this to dramatically increase the user experience of an app and make our apps feel more refined and well designed.

At the highest level, the Web Animations API is a standardized JavaScript API which is baked into browsers that allows developers to animate DOM elements. CSS was always been the most performant way to animate on the web because the CSS animations engine can run animations on the GPU instead of the CPU allowing us to achieve smooth 60 fps animations. The Web Animations API finally allows us to write animation logic using JavaScript and opens up the browsers animation engine allowing us to run these animations on the GPU. As well as performant animations there are host of other benefits the Web Animations API provides us. Because it is a JavaScript API we can easily create dynamic animations by altering durations, easing methods and other variables; something which is very hard to do in CSS. The API provides very flexible playback control which allows us to Pause, Rewind, Skip and even change the rate of playback and more. The API is Promise based so it is really easy to chain multiple animations or run other logic when the animation completes. And because the Web Animations API is a browser feature there are no external dependencies to manage or maintain. Today most JavaScript libraries take a component based approach. Whether that’s using Angular, React, VueJS or just native web components the Web Animations API fits in with this architecture because the JavaScript used to create this animations can be embedded into the components easily without any dependencies. These are great benefits provided by the Web Animations API which we can use to harness the power of the GPU to create silky smooth animations that are dynamic and flexible.

Exploring the WP-API

Checking the API index

The WP-API provides us with an index of all available routes and their endpoints. To get to that index, type in, for e.g., http://localhost/wp-json/wp/v2 in Postman. This is a first level route. All the other routes start with this, and then continue onwards.

Exploring Common Routes

API Index – GET /wp-json/wp/v2/ => This gives us a list of all the available routes and, within each of the routes, you will get a list of all the available endpoints and within the endpoints, you get a list of all the available arguments.

Post index (10 latest posts) – GET /wp-json/wp/v2/posts

Post index (all available posts) – GET /wp-json/wp/v2/posts?per_page=0

Single post based on ID – GET /wp-json/wp/v2/posts/{post-ID}

Page index (10 latest pages) – GET /wp-json/wp/v2/pages

Single page based on ID – GET /wp-json/wp/v2/pages/{page-ID}

Category index (10 first categories, alphabetically) – GET /wp-json/wp/v2/terms/category

Category index (all available categories) – GET /wp-json/wp/v2/terms/category?per_page=0

Single category based on ID – GET /wp-json/wp/v2/terms/category/{cat-ID}

Posts in category based on category slug – GET (…)/posts?filter[category_name]={slug}

Posts in category based on category ID – GET (…)/posts?filter[cat]={cat-ID}

Tag index (10 first tags, alphabetically) – GET /wp-json/wp/v2/terms/tag

Tag index (all available tags) – GET /wp-json/wp/v2/terms/tag?per_page=0

Single tag based on ID – GET /wp-json/wp/v2/terms/tag/{tag-ID}

Posts in tag based on tag name (slug) – GET (…)/posts?filter[tag]={slug}

Posts in tag based on tag ID – GET (…)/posts?filter[tag_id]={tag-ID}

User index (10 most recent) – GET /wp-json/wp/v2/users

Current logged in user – GET /wp-json/wp/v2/users/me

Single user based on ID – GET /wp-json/wp/v2/users/{user-ID}

Comments index (10 most recent) – GET /wp-json/wp/v2/comments

10 latest comments on specific post based on post ID – GET /wp-json/wp/v2/comments?post={post-ID}

All comments on specific post based on post ID – GET /wp-json/wp/v2/comments?post={post-ID}&per_page=0


What is the WP-API?

The WP-API is a RESTful API that can be accessed through simple HTTP requests to access the site data in JSON format. The WP-API is a new way of accessing the data WordPress provides without having to go through a theme, or a RSS feed, or XML-RPC. Using WP-API we can now Create, Read, Update and Delete (CRUD) content in the WordPress database without interacting with WordPress directly. Getting the data from a WordPress site using the API is as simple as submitting a standard HTTP request or URL. Once you have that data you can use any application or programming language to do whatever you want with it. So we can build WordPress sites using PHP or we can build them using JavaScript or Ruby or Objective-C or whatever we want. The WP-API gives us direct access to the data and allows us to do whatever we want with it. The WP-API also allows us to access and edit the data in the database without going through WordPress Admin. However, this is only possible if you have the right security credentials so your data is not at risk.

What are RESTful APIs and JSON?

REST is an acronym for REpresentational State Transfer and describes the software architecture of the web. A RESTful application is typically one that uses standard HTTP verbs like GET, POST, PUT and DELETE to retrieve and send data from and to a remote server. RESTful applications use resources – essentially URIs to interface with external systems such as a remote server and use the 4 HTTP verbs to perform operations on the server.

API is an acronym for Application Programming Interface and is a set of routines, protocols and tools for building applications and interfaces.

RESTful API is an application programming interface that uses resource URIs to perform operations on a remote server through HTTP verbs. We can send a URI to the server, and get pure data back. In the WP-API, data comes back as JSON.

JSON is an acronym for JavaScript Object Notation and is an open standard format used to transmit data objects in the form of attribute-value pairs for further processing. JSON is typically used for asynchronous communication between browsers and servers, the kind of communication performed by RESTful APIs, and is favored over XML because it’s cleaner and easier to work with.

In Summary, The WP-API is a RESTful API for WordPress that returns data objects in the JSON format when provided with a route and an endpoint.

Understanding routes and endpoints.

Interacting with the WP-API is done through accessing routes and endpoints. The WP-API has a wide variety of routes and endpoints.

An Endpoint is a function available through the API in the form of HTTP verbs GET, POST, PUT, and DELETE. An endpoint performs a specific function by taking one or more parameters and returning the resulting data to the client.

A Route is the “name” we use to access the available endpoints. In simple terms, the route is the URL, and the endpoint is the action performed on the URL.

For Example,

GET wp/v2/posts/1234 => Retrieves the data from post 1234 as an object

PUT wp/v2/posts/1234 => Updates the database entry for the object with the ID 1234

DELETE wp/v2/posts/1234 => Deletes the database entry for the object with the ID 1234

In the above example, GET, PUT and DELETE are the endpoints whereas wp/v2/posts/1234 is the route.

Information about the WP-API can be found at

  1. WP REST API v2 Documentation
  2. WP REST API – a JSON-based REST API for WordPress Project on GitHub
  3. WordPress REST API (Version 2) Plugin