paulirish

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics

• elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent

cecilemuller

How to setup Let's Encrypt for Nginx on Ubuntu 18.04 (including IPv6, HTTP/2 and A+ SLL rating)

---

Virtual hosts

Let's say you want to host domains first.com and second.com.

Create folders for their files:

addyosmani

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

nztim

###Install Node and Bower

• Set up the NodeSource repo and install Node
• curl -sL https://deb.nodesource.com/setup_0.12 | sudo bash -
• sudo apt-get install nodejs
• Install bower: sudo npm install -g bower

Install StackEdit

• Clone the repo: git clone https://github.com/benweet/stackedit
• To use a domain other than 'localhost', edit /public/res/constants.js:
• constants.BASE_URL = "http://stackedit.dev:3000/";

so0k

Digital Ocean recently released private networking support in their NYC2 Data center.

They also published a blog post on how to setup a new droplet with private networking. But one thing the post doesn't do is tell you how to scale your private network for many boxes. One approach is obviously to edit /etc/hosts (but this gets annoying when you add a new box). A better way is to create an internal DNS zone (via the digital ocean web interface) and have your droplets use it:

Steps

setup the internal DNS zone file

1. Login to digital ocean
2. Click "DNS" on the right hand menu

hassansin

Model::

  /*Select*/
  select('col1','col2')
  ->select(array('col1','col2'))
  ->select(DB::raw('businesses.*, COUNT(reviews.id) as no_of_ratings, IFNULL(sum(reviews.score),0) as rating'))  
  ->addSelect('col3','col4')
  ->distinct() // distinct select
  
  /*From*/

tokhi

#Unix Toolbox

This document is a collection of Unix/Linux/BSD commands and tasks which are useful for IT work or for advanced users. This is a practical guide with concise explanations, however the reader is supposed to know what s/he is doing.

##Unix Toolbox revision 14.4

The latest version of this document can be found at http://cb.vu/unixtoolbox.xhtml. Replace .xhtml on the link with .pdf for the PDF version and with .book.pdf for the booklet version. On a duplex printer the booklet will create a small book ready to bind. This XHTML page can be converted into a nice PDF document with a CSS3 compliant application (see the script example). See also the about page.
Error reports and comments are m

magnetikonline

Nginx FastCGI response buffer sizes

By default when Nginx starts receiving a response from a FastCGI backend (such as PHP-FPM) it will buffer the response in memory before delivering it to the client. Any response larger than the set buffer size is saved to a temporary file on disk.

This process is outlined at the Nginx ngx_http_fastcgi_module page manual page.

• Introduction
• Determine actual FastCGI response sizes
• Setting the buffer size
• Verifying results

reinink

select
  first_name,
  last_name
from
  users
left join
  companies on companies.id = users.company_id
where (
    companies.name like 'TERM%' or
    first_name like 'TERM%' or

danmatthews

// Add this to your 'plugins' array in your tailwind config file.
// This creates classes suffixed with an opacity level for each bg colour
// For example, .bg-red would have .bg-red-10 through .bg-red-100 for 0.10% opacity background and 100% opacity respectively.
({addUtilities, config}) => {
      let colors =  config('colors', []);
      const newColors = {};
      let hexToRgb = (hex) => {
        var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
        return result ? {
          r: parseInt(result[1], 16),