jsuryahyd

/**
 * Ask: Update the App component so the <h2> element gets a color
 * from the COLORS array. Clicking on the Next button should cycle through the colors.
 *
 * Example: It should be initially blue, then red, ..., cyan, and then blue again.
 */
import ReactDOM from "react-dom";
// import { useState } from "react";

const COLORS = ["blue", "red", "green", "yellow", "black", "cyan"];

DmitriiNazimov

/**
 *
 * ПАТТЕРН ПРИСПОСОБЛЕНЕЦ/ЛЕГКОВЕС (Flyweight)
 *
 * Паттерн ПРИСПОСОБЛЕНЕЦ/ЛЕГКОВЕС -  структурный шаблон проектирования, при котором объект, представляющий себя как
 * уникальный экземпляр в разных местах программы, по факту не является таковым.
 * Данный паттерн проектирования позволяет вместить большее количество объектов в отведённую оперативную память.
 * Легковес экономит память, разделяя общее состояние объектов между собой, вместо хранения одинаковых данных в
 * каждом объекте.

bradtraversy

MongoDB Cheat Sheet

Show All Databases

show dbs

Show Current Database

jakub-g

<script> async, defer, async defer, module, nomodule, src, inline - the cheat sheet

With the addition of ES modules, there's now no fewer than 24 ways to load your JS code: (inline|not inline) x (defer|no defer) x (async|no async) x (type=text/javascript | type=module | nomodule) -- and each of them is subtly different.

This document is a comparison of various ways the <script> tags in HTML are processed depending on the attributes set.

If you ever wondered when to use inline <script async type="module"> and when <script nomodule defer src="...">, you're in the good place!

Note that this article is about <script>s inserted in the HTML; the behavior of <script>s inserted at runtime is slightly different - see Deep dive into the murky waters of script loading by Jake Archibald (2013)

faressoft

DOM Performance

• How the browser renders the document
  • Receives the data (bytes) from the server.
  • Parses and converts into tokens (<, TagName, Attribute, AttributeValue, >).
  • Turns tokens into nodes.
  • Turns nodes into the DOM tree.
• Builds CSSOM tree from the css rules.

DavidWells

Aligning images

This is a guide for aligning images.

See the full Advanced Markdown doc for more tips and tricks

left alignment

gaearon

// connect() is a function that injects Redux-related props into your component.
// You can inject data and callbacks that change that data by dispatching actions.
function connect(mapStateToProps, mapDispatchToProps) {
  // It lets us inject component as the last step so people can use it as a decorator.
  // Generally you don't need to worry about it.
  return function (WrappedComponent) {
    // It returns a component
    return class extends React.Component {
      render() {
        return (

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

trevnorris

uv_run

- uv__update_time(): Update time with millisecond precision.


- uv__run_timers(): Loop through "heap" and run timers whose timeout > time.


- uv__run_pending(): Run all callbacks on the pending_queue. Remove each item
  from the queue when run.

rxaviers

People

:bowtie:	😄 :smile:	😆 :laughing:
😊 :blush:	😃 :smiley:	☺️ :relaxed:
😏 :smirk:	😍 :heart_eyes:	😘 :kissing_heart:
😚 :kissing_closed_eyes:	😳 :flushed:	😌 :relieved:
😆 :satisfied:	😁 :grin:	😉 :wink:
😜 :stuck_out_tongue_winking_eye:	😝 :stuck_out_tongue_closed_eyes:	😀 :grinning:
😗 :kissing:	😙 :kissing_smiling_eyes:	😛 :stuck_out_tongue: