CleverStyle Framework 4 Release
Somehow it was impossible to write more than one article from the beginning of a new branch ( part 1 , part 2 , part 3 ), but again there is something interesting to tell, because the first release of the 4.x series was released .
The first thing I would like to say is that the project was renamed from the CleverStyle CMS to the CleverStyle Framework. Finally! No more confusion between title and content.
If the 2.x series began with significant changes on the server side, and 3.x with comparable changes on the client, then 4.x brings improvements everywhere.
')
On the server, the speed of work is significantly increased, while this is a full-stack framework, using an HTTP server based on ReactPHP, you can get the page generation rate BELOW 1ms, HTML generation in typical scenarios became faster.
Also added convenient support for nested structures in translation files, added support for SQLite, PostgreSQL, support for working as a PSR7 Middleware (initialization from a PSR7-compliant request object and outputting the result to a PSR7-compatible response object) and associated abstractions in the kernel itself .
RequireJS is widely used on the frontend, a number of libraries that are unconditionally loaded on the frontend, are now loaded only when directly needed, optimizations have been added to quickly draw the first frame (first paint).
At the junction of the backend and frontend optimize the construction of the static cache (CSS / JS / HTML), HTTP / 2 Server push,
In general, the system looks like a good hybrid (not a pure micronucleus, but not such a fat one) full-stack php framework.
As always, it was not without improvement of the code metrics, for example, Scrutinizer rating :)
You can start with the same thing with which the previous article - with web components.
Polymer itself is still supplied patched, but for a different purpose. All important PRs were accepted, 2 not accepted ones are delivered as runtime patches and do not affect the build itself. But now from the Polymer assemblies used in the system, support for the Shady DOM has been cut, since the system uses the full version of the Shadow DOM (and the full polyfill is there where there is no support). As a result, the build is significantly smaller than the original.
Polyfill WebComponents.js is also optimized. Firstly, all the polifiles for IE / Edge (which are connected only for the mentioned browsers) are cut out of it, just WebComponents.js is not connected for Chromium / Chrome, because it is simply not needed there.
Web components themselves are used more and more, for example, now with their use the following modules have been refactored: Blogs, Comments, Disqus, and the system has been using them for a long time.
Also, the system has learned to minify HTML files better, now all JS are combined and some errors of early implementation have been fixed.
This is actually a very important feature. The latest version instead of RequireJS uses a more modern and compact (but backward compatible) counterpart from the same developer Alameda.
RequireJS is integrated at all levels:
Thus, the amount of required code has been significantly reduced, reduced further in the 5.x series, and gives the developer even more potential.
As time goes on, in the kernel only __proto__ is not used for compatibility with IE 10, the rest of the burden of compatibility has been moved to the new plug-in Old IE , where IE 11 will also be supported in the 5.x series.
Now a little about the server side. The system objects
All this together has maximally simplified the use of the framework as Middleware, which can be seen on the example of how integration with ReactPHP is happening now.
Since re-initialization is provided automatically at the kernel level, it has become possible to never recreate system objects at all, but instead only reinitialize the necessary parts. This allows you to achieve page generation in less than 1ms.
Also, along with support for abstractions, a standalone fully streaming parser of multipart requests was written, so uploading files will work with any method, not just POST, the site will not break if you
These two database drivers have been fully added to the kernel, but so far none of the modules are supported (this is temporary). SQLite can be used for simple sites where the database itself is not needed at all, but the system requires it to store the configuration and settings of a single administrator. In this scenario, SQLite will not slow down, since caching will reduce its use to zero in most cases.
The sessions turned out to be an interesting story with a good ending. Historically, the system uses a custom session system that is more flexible than the built-in system, scales well and works very quickly.
Quickly, but not as much as it can be without any sessions. As a result, the latest versions of the system do not give a session to the user while he does not use something, for which sessions are actually needed. This allows you to avoid queries to the database on standard pages for users who first came to the site.
The feature suggested itself for a long time. First, there was support for prefixes in objects with translations, then prefixes began to bother with the most translations, so now you can do it easier:
The latest versions of Chromium / Chrome support the preload header / meta tag, which tells the browser that this resource is 100% needed on the page, load it even if you haven’t yet understood why, I know for sure that it will be needed.
The same attribute is used by nghttp2 and CloudFlare for HTTP / 2 Server push.
Since the framework initially has information about what static resources are and the dependencies between them, and during the minification and compression it also knows what pictures, fonts and other things are used inside the resources, it uses this information to generate the corresponding headers, which is the most positive way affects page load time.
The latest release also brought a useful feature of the kernel-level CLI interface. So far, little is available through it, but very soon there will be more. There are big plans for it both in the core and in the components, although now you can do something useful, well, or use them in your components :)
The components of Blogs, Comments, Composer, Disqus, Uploader, Composer assets and TinyMCE use the latest handy kernel features, and are examples of how to make components in the modern version of the framework. The remaining components are for the most part simply ported for compatibility with new versions and do not use the system's potential to be 100%, but will be in future updates.
Third-party dependencies have been updated to current versions at the time of release.
Documentation after some reflection was transferred to the same repository as the source code. Firstly, it is easier to synchronize changes, and secondly, you can now see the documentation, what it was in older versions of the system if needed (or compare changes in documentation from version to version), which could not be done in a simple way with the wiki.
I don’t know if this is a lot or a little, but from 7.74 to 8.15 the estimate has risen, and the distribution has significantly changed:
I began to record screencasts on how to use the system, I hope, they will help you quickly and easily start using the system, orders are accepted for which aspects of the system are of interest primarily and in general any comments on this case.
Those who want to chat can do it in Gitter .
The code on GitHub is the documentation in the docs folder.
You can start feeling in one line with Docker (it’s better to use Firefox, Chromium doesn’t want to set a cookie on localhost):
Also, the new version is used on cleverstyle.org (with HTTP / 2 and other pleasures).
Briefly about everything
The first thing I would like to say is that the project was renamed from the CleverStyle CMS to the CleverStyle Framework. Finally! No more confusion between title and content.
If the 2.x series began with significant changes on the server side, and 3.x with comparable changes on the client, then 4.x brings improvements everywhere.
')
On the server, the speed of work is significantly increased, while this is a full-stack framework, using an HTTP server based on ReactPHP, you can get the page generation rate BELOW 1ms, HTML generation in typical scenarios became faster.
Also added convenient support for nested structures in translation files, added support for SQLite, PostgreSQL, support for working as a PSR7 Middleware (initialization from a PSR7-compliant request object and outputting the result to a PSR7-compatible response object) and associated abstractions in the kernel itself .
RequireJS is widely used on the frontend, a number of libraries that are unconditionally loaded on the frontend, are now loaded only when directly needed, optimizations have been added to quickly draw the first frame (first paint).
At the junction of the backend and frontend optimize the construction of the static cache (CSS / JS / HTML), HTTP / 2 Server push,
Link: <preload> and much more.In general, the system looks like a good hybrid (not a pure micronucleus, but not such a fat one) full-stack php framework.
As always, it was not without improvement of the code metrics, for example, Scrutinizer rating :)
Polymer and Web Components
You can start with the same thing with which the previous article - with web components.
Polymer itself is still supplied patched, but for a different purpose. All important PRs were accepted, 2 not accepted ones are delivered as runtime patches and do not affect the build itself. But now from the Polymer assemblies used in the system, support for the Shady DOM has been cut, since the system uses the full version of the Shadow DOM (and the full polyfill is there where there is no support). As a result, the build is significantly smaller than the original.
Polyfill WebComponents.js is also optimized. Firstly, all the polifiles for IE / Edge (which are connected only for the mentioned browsers) are cut out of it, just WebComponents.js is not connected for Chromium / Chrome, because it is simply not needed there.
Web components themselves are used more and more, for example, now with their use the following modules have been refactored: Blogs, Comments, Disqus, and the system has been using them for a long time.
Also, the system has learned to minify HTML files better, now all JS are combined and some errors of early implementation have been fixed.
RequireJS (Alameda)
This is actually a very important feature. The latest version instead of RequireJS uses a more modern and compact (but backward compatible) counterpart from the same developer Alameda.
RequireJS is integrated at all levels:
- third-party libraries, such as autosize, html5sortable and jssha, supplied with the kernel, are actually used exclusively as AMD modules and nothing else (jQuery is expected to be rendered similarly in 5.x)
- all components can use AMD modules for their own needs is very simple, for example,
components/modules/Blogs/includes/js/xyz.jscan be transparently loaded as a moduleBlogs/xyz(subfolders are also supported) - when
bower_componentsand / ornode_modulesfrom Bower / NPM are found in the root of the site, AMD modules will be automatically searched, so you can immediately callrequire(['lodash']).then(function (_) {})without configuration - Similarly, the root Bower / NPM folders, the dependencies installed via the Composer assets plugin will be processed in the same way, becoming accessible by name without any paths
- Moreover, if you refer to the modules installed through Composer assets in an absolute way as if they are installed in the root, for example,
/node_modules/d3/d3then everything will work as if dependency and the truth is installed there!
Thus, the amount of required code has been significantly reduced, reduced further in the 5.x series, and gives the developer even more potential.
IE 10
As time goes on, in the kernel only __proto__ is not used for compatibility with IE 10, the rest of the burden of compatibility has been moved to the new plug-in Old IE , where IE 11 will also be supported in the 5.x series.
Request / Response, PSR7
Now a little about the server side. The system objects
cs\Request and cs\Response added, both are able to work with PSR7 , and both provide re-initialization as needed.All this together has maximally simplified the use of the framework as Middleware, which can be seen on the example of how integration with ReactPHP is happening now.
Since re-initialization is provided automatically at the kernel level, it has become possible to never recreate system objects at all, but instead only reinitialize the necessary parts. This allows you to achieve page generation in less than 1ms.
Also, along with support for abstractions, a standalone fully streaming parser of multipart requests was written, so uploading files will work with any method, not just POST, the site will not break if you
enable_post_data_reading = Off in php.ini (under ReactPHP is not yet support for uploading files, I really hope that in the near future there will be a new release with https://github.com/reactphp/http/pull/41 in its composition).SQLite / PostgreSQL
These two database drivers have been fully added to the kernel, but so far none of the modules are supported (this is temporary). SQLite can be used for simple sites where the database itself is not needed at all, but the system requires it to store the configuration and settings of a single administrator. In this scenario, SQLite will not slow down, since caching will reduce its use to zero in most cases.
Sessions
The sessions turned out to be an interesting story with a good ending. Historically, the system uses a custom session system that is more flexible than the built-in system, scales well and works very quickly.
Quickly, but not as much as it can be without any sessions. As a result, the latest versions of the system do not give a session to the user while he does not use something, for which sessions are actually needed. This allows you to avoid queries to the database on standard pages for users who first came to the site.
Namespaces in translation files
The feature suggested itself for a long time. First, there was support for prefixes in objects with translations, then prefixes began to bother with the most translations, so now you can do it easier:
HTTP / 2 Server push, preload
The latest versions of Chromium / Chrome support the preload header / meta tag, which tells the browser that this resource is 100% needed on the page, load it even if you haven’t yet understood why, I know for sure that it will be needed.
The same attribute is used by nghttp2 and CloudFlare for HTTP / 2 Server push.
Since the framework initially has information about what static resources are and the dependencies between them, and during the minification and compression it also knows what pictures, fonts and other things are used inside the resources, it uses this information to generate the corresponding headers, which is the most positive way affects page load time.
CLI interface
The latest release also brought a useful feature of the kernel-level CLI interface. So far, little is available through it, but very soon there will be more. There are big plans for it both in the core and in the components, although now you can do something useful, well, or use them in your components :)
Updates
The components of Blogs, Comments, Composer, Disqus, Uploader, Composer assets and TinyMCE use the latest handy kernel features, and are examples of how to make components in the modern version of the framework. The remaining components are for the most part simply ported for compatibility with new versions and do not use the system's potential to be 100%, but will be in future updates.
Third-party dependencies have been updated to current versions at the time of release.
Documentation
Documentation after some reflection was transferred to the same repository as the source code. Firstly, it is easier to synchronize changes, and secondly, you can now see the documentation, what it was in older versions of the system if needed (or compare changes in documentation from version to version), which could not be done in a simple way with the wiki.
Scrutinizer
I don’t know if this is a lot or a little, but from 7.74 to 8.15 the estimate has risen, and the distribution has significantly changed:
Video tutorials for developers
I began to record screencasts on how to use the system, I hope, they will help you quickly and easily start using the system, orders are accepted for which aspects of the system are of interest primarily and in general any comments on this case.
Those who want to chat can do it in Gitter .
The code on GitHub is the documentation in the docs folder.
You can start feeling in one line with Docker (it’s better to use Firefox, Chromium doesn’t want to set a cookie on localhost):
docker run --rm -p 8888:8888 nazarpc/cleverstyle-framework Also, the new version is used on cleverstyle.org (with HTTP / 2 and other pleasures).
Source: https://habr.com/ru/post/302944/
All Articles