Themes Mattr Framework

Themes Mattr Framework is a web framework created by Maciek Rek and intended for the development of beautiful, fast and flexible websites and web applications. It is currently powered by WordPress.

Objectives

  1. Performance
  2. Flexibility and scalability
  3. Reusable components

As the web technology evolves and the visual, UI and UX trends change, it is important that a themes are flexible and can be extensively transformed and improved when needed.

The problem

It is important that websites are speed-optimised. Despite the internet getting faster than ever before, users don’t always have ideal connection. Google Search favours faster websites as well.

Most small to medium business use shared hosting packages for their web sites. Those aren’t fast, so it is even more important that website is lightweight and properly cached.

Various pages of a typical website have different sizes and complexity. Yet in a typical WordPress site, every single page, even the simplest one, loads all of the styles, scripts and functionality that is used in all other pages.

This is okay with very small sites but becomes problematic as a website grows.

The idea

The inspiration for TMF came from operating systems and desktop applications, particularly from their dynamically linked libraries.

Themes Mattr Framework loads only essential assets and functionality by default. The assets and plugins can be assigned exclusively to a single page. Every page loads only the functionality it requires and nothing more. Of course common sense applies here and very small or commonly used components will be also loaded globally.

This simple feature is very powerful. It allows for having libraries of optional components and their amount is limited by nothing but the server storage size. Those additional components are loaded dynamically, whenever required as well as can be pre-defined by a theme developer or page editor in the admin panel.

For example, a page might only load a slider-banner and a news-feed components and other page will load only forms functionality.

One website section might require different look than others. The MTF allows for loading a separate set of functions and assets to any page or group of pages.

This approach allows for having virtually unlimited number of features, layout adjustments and templates customisation within a single site.

How it’s achieved?

Early querying

At the heart of Themes Mattr Framework lies the early post access. It means that the theme retrieves the post ID before the wp hook. It opens-up a whole new set of possibilities and drastically improves flexibility of the build.

Scanning of the content and metadata before enqueuing assets allows each page template to be thoroughly customised with required components and overrides.

Separate admin panel from the front-end

Separating the admin and front-end functions and assets further improves performance and code clarity.

Build details

Minimise run-time dependency

Themes Mattr Framework is intended as CMS-independent, but due to resources limitation it works only with WordPress at the moment.

There is no further run-time dependency. TMF relies strictly on native WordPress functions.

Some WordPress plugins are recommended but not required. Those include analytics, SEO and cache/asset optimisation and redirections.

Pre-process everything

The Framework heavily relies on pre-processing. Only the PHP code is passed as is but it can be also minified in pre-processing.

Pre-processing serves few important purposes:

Theme and templates customisation

Most of the Project settings such as colours, spacing, typography are stored in JSON files. It means that any script including pre-process, server-side and client-side has direct access to them.

Project components can be also created or customised. Such component could be anything from colour of a button to a whole page template.

Custom build system

Themes Mattr Framework has it’s own build system built-in. It is powered by open-source tools such as FSWatch, Coffee, Haml, UglifyJS, Babel, Sass and Browser-Sync. There is also a handy management, development and deployment app available for macOS.

Extensive library

There is a robust library of components included in TMF. It includes functionality that is usually provided by additional WordPress plugins such as custom types management, custom shortcodes and blocks, sliders, hero sections, contact forms and many more. The library is constantly growing.

Planned and upcoming updates

The SCSS part of the library still relies on Compass CSS authoring framework. It might be phased-out as Compass hasn’t been updated in many years.

Integration of PJAX – a library that improves browsing experience and allows for cool page transitions.

Can I download and use Themes Mattr Framework in my project?

You can order a custom WordPress website built on the TMF. Contact Maciek Rek to discuss your project’s requirements.

Add a comment