Today, we will show some of the best practices used in design integration. In this article we are referring only to CSS, even if the topic is large and contains multiple elements like structure, layout, interactivity, functionality or other stuff that are also important and can be covered in other articles.
Knowing the right way to integrate a design will determine a more structured code and also will help your team and the future developers that will work on the same code to understand the project faster and be more efficient. And probably they will thank you. :)
So, let's begin and see what are the 5 CSS best practices used in design integration.
Building up an efficient department is not easy - improvements can be done everywhere. We recently started to boost up the efficiency of our Quality Assurance department and the results were great!
Using the project management tool Redmine most of the time, beside actual testing, was spent on putting error reports into it.
Writing good error reports is a science already but you can improve it a lot by attaching screenshtos or videos - showing the actual "undocumented feature". Main task is to make it as easy as possible for the developer to understand and reproduce it.
The initial process went like this:
Lot of steps, for simply attaching an image to an issue. This can be definitely improved...
We recently needed to write an algorithm to unpack a specific file from a proprietary archive format.
The fun part is that the initial task quickly transformed into a research task as our colleague Michael wanted to dig deeper in the topic. Here is the story behind the performance boost.
I never worked with binary files before in PHP so I decided to first get it working and care about optimisations later.
My straight forward approach of using file_get_contents and normal string operations resulted in very low performing and memory hungry process.
For getting a 10kb file out of an 2MB archive the algorithm took ~1.200ms and ~14mb memory at its peak.
This had to be optimized ... and I succeeded to bring it down to 30ms and 1MB memory at its peak ...
Even though bandwith increases, website optimization is a bigger issue then ever. Mobile devices don't benefit from modern fiber lanes and web applications get more complex and require more and more ressources to load.
Additionaly loaded ressources may load additionally ressources which couldn't be loaded before (cause they where unknown), making the load even longer.
There are a bunch of books, articles and tutorials out there describing possible improvements as well as tools analyzing it but gooing through all the items takes time...