Skip to content

Instantly share code, notes, and snippets.

View sorie's full-sized avatar
💭
I may be slow to respond.

lala sorie

💭
I may be slow to respond.
  • Seoul or Jeju island
View GitHub Profile
<html>
<head>
<!-- Load Tensorflow and BodyPix -->
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@1.2"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/body-pix@2.0"></script>
</head>
<body>
<img hidden id='image' src='/img/sample.jpg' />
@faressoft
faressoft / dom_performance_reflow_repaint.md
Last active March 24, 2024 11:41
DOM Performance (Reflow & Repaint) (Summary)

DOM Performance

Rendering

  • 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.
@paulirish
paulirish / what-forces-layout.md
Last active April 30, 2024 17:56
What forces layout/reflow. The comprehensive list.

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
@ihoneymon
ihoneymon / how-to-write-by-markdown.md
Last active May 4, 2024 04:19
마크다운(Markdown) 사용법

[공통] 마크다운 markdown 작성법

영어지만, 조금 더 상세하게 마크다운 사용법을 안내하고 있는
"Markdown Guide (https://www.markdownguide.org/)" 를 보시는 것을 추천합니다. ^^

아, 그리고 마크다운만으로 표현이 부족하다고 느끼신다면, HTML 태그를 활용하시는 것도 좋습니다.

1. 마크다운에 관하여

@marocchino
marocchino / 094607.md
Last active July 19, 2022 14:25
ES6시대의 JavaScript

ES6시대의 JavaScript

안녕하세요. 사원사업부의 마루야마@h13i32maru입니다. 최근의 Web 프론트엔드의 변화는 매우 격렬해서, 조금 눈을 땐 사이에 점점 새로운 것이 나오고 있더라구요. 그런 격렬한 변화중 하나가 ES6이라는 차세대 JavaScript의 사양입니다. 이 ES6는 현재 재정중으로 집필시점에서는 Draft Rev31이 공개되어있습니다.

JavaScript는 ECMAScript(ECMA262)라는 사양을 기반으로 구현되어있습니다. 현재 모던한 Web 브라우저는 ECMAScript 5.1th Edition을 기반으로 한 JavaScript실행 엔진을 탑재하고 있습니다. 그리고 다음 버전인 ECMAScript 6th Edition이 현재 재정중으로, 약칭으로 ES6이라는 명칭이 사용되고 있습니다.

@chad3814
chad3814 / gist:2924672
Last active January 16, 2024 20:27
deleting array items in javascript with forEach() and splice()
// This is from my comment here: http://wolfram.kriesing.de/blog/index.php/2008/javascript-remove-element-from-array/comment-page-2#comment-466561
/*
* How to delete items from an Array in JavaScript, an exhaustive guide
*/
// DON'T use the delete operator, it leaves a hole in the array:
var arr = [4, 5, 6];
delete arr[1]; // arr now: [4, undefined, 6]