Diablohu Diablohu

## fly-dbh-bilibili-live-page.user.js
// ==UserScript==
// @name         [FLY-DBH] 哔哩哔哩直播页UI改造
// @namespace    https://fly-dbh.com/
// @version      0.12.0
// @description  哔哩哔哩直播页UI改造
// @author       Diablohu
// @match        https://live.bilibili.com/*
// @icon         data:image/x-icon;base64,AAABAAEAICAAAAEAIACoEAAAFgAAACgAAAAgAAAAQAAAAAEAIAAAAAAAABAAABMLAAATCwAAAAAAAAAAAAD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A1qEAANahAADWoQAG1qEAb9ahAMvWoQD01qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD01qEAy9ahAG/WoQAG1qEAANahAADWoQAA1qEAG9ahAM/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahANDWoQAb1qE

## gist:e6665efe7a0a6cbe1931b42b18a35129

      
              1 file
            
          
              0 forks
            
          
                0 comments
              
            
              0 stars
            
          
                Diablohu
                / gist:e6665efe7a0a6cbe1931b42b18a35129
            
            
              Created
              January 13, 2020 09:24
            
              
                Koot 0.12 Release
              
          
    Koot 0.12 正式发布
改动亮点


重做 Service Worker 模板和生成逻辑
现在默认支持在浏览器环境中使用 async / await 开发
完善生产环境 Webpack 配置的 optimization 设置 (用于代码拆分)，通常情况下已无需进行配置
完善开发环境的 devDll 设置 (用于加速热更新)，通常情况下已无需进行配置
优化 <script> 和 <style> 标签的生成逻辑
可直接设定客户端打包结果中静态资源存放路径的目录名 (URL 中的 includes 目录名)


## button-install-pwa.jsx
/* eslint-disable no-console */

import React, { useState, useEffect } from 'react';

// 缓存 beforeinstallprompt 事件对象
let evtBeforeInstallPrompt;

// 按钮组件: PWA 安装按钮
const ButtonInstallPWA = React.memo(() => {
    // 是否显示安装按钮的 useState hook

## deep-copy.js
const deepCopy = (obj = {}) => {
    const objEncountered = [obj];

    const copy = (obj = {}) => {
        const newObj = {};

        Object.entries(obj).forEach(([key, value]) => {
            if (typeof value === 'object') {
                if (objEncountered.includes(value)) {
                    newObj[key] = value;

## react-roadmap-late-2018-summary-zhcn.md

      
              1 file
            
          
              0 forks
            
          
                0 comments
              
            
              0 stars
            
          
                Diablohu
                / react-roadmap-late-2018-summary-zhcn.md
            
            
              Last active
              November 28, 2018 03:36
            
              
                React 官方线路图简介翻译 (2018年末)
              
          
    React 线路图

完整官方线路图文章 (英文): https://reactjs.org/blog/2018/11/27/react-16-roadmap.html
已确定的版本开发计划


16.6：Suspense for Code Splitting / 针对代码分割的暂停渲染（已发布）
16.7：Hooks / 钩子（2019 Q1）
16.8：Concurrent Mode / 同时模式（2019 Q2）
16.9：Suspense for Data Fetching / 针对数据获取的暂停渲染（2019年中）


## React16KeyFeatures.md

      
              1 file
            
          
              0 forks
            
          
                0 comments
              
            
              0 stars
            
          
                Diablohu
                / React16KeyFeatures.md
            
            
              Last active
              September 27, 2017 02:55
            
              
                React 16 特性
              
          
    组件的 render() 方法现在可以以String或Array作为返回值，不再要求必须包在容器中


当以Array作为返回值时，需要注意提供key
当以String或Array作为返回值时，React会直接将其渲染到父级元素中，不会创建额外元素

render() {
  // No need to wrap list items in an extra element!
  return [
    // Don't forget the keys :)
    <li key="A">First item</li>,
 Second item,

  
## index.html
<div ng-app="grid" ng-controller="grid">
   <div class="controls">
      <label>
         Items count:
         <input type="number" ng-model="itemCount" min="1" />
      </label>
      <label>
         Items width (px):
         <input type="number" ng-model="itemWidth" min="1" ng-change="updateStyleContainer()" />
      </label>

## WhoCallsTheFleet-version.json
{
	"app":		"0.5.1",
	"app-db":	"1.2.0",
	"pics":		"1.2.0"
}

## index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">

  <title>Ratio box &middot; CodePen</title>
  <!--
    Copyright (c) 2012 Diablohu, http://codepen.io/Diablohu

    Permission is hereby granted, free of charge, to any person obtaining
	// ==UserScript==
	// @name [FLY-DBH] 哔哩哔哩直播页UI改造
	// @namespace https://fly-dbh.com/
	// @version 0.12.0
	// @description 哔哩哔哩直播页UI改造
	// @author Diablohu
	// @match https://live.bilibili.com/*
	// @icon data:image/x-icon;base64,AAABAAEAICAAAAEAIACoEAAAFgAAACgAAAAgAAAAQAAAAAEAIAAAAAAAABAAABMLAAATCwAAAAAAAAAAAAD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A1qEAANahAADWoQAG1qEAb9ahAMvWoQD01qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD01qEAy9ahAG/WoQAG1qEAANahAADWoQAA1qEAG9ahAM/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahAP/WoQD/1qEA/9ahANDWoQAb1qE
	/* eslint-disable no-console */

	import React, { useState, useEffect } from 'react';

	// 缓存 beforeinstallprompt 事件对象
	let evtBeforeInstallPrompt;

	// 按钮组件: PWA 安装按钮
	const ButtonInstallPWA = React.memo(() => {
	// 是否显示安装按钮的 useState hook
	const deepCopy = (obj = {}) => {
	const objEncountered = [obj];

	const copy = (obj = {}) => {
	const newObj = {};

	Object.entries(obj).forEach(([key, value]) => {
	if (typeof value === 'object') {
	if (objEncountered.includes(value)) {
	newObj[key] = value;
	<div ng-app="grid" ng-controller="grid">
	<div class="controls">
	<label>
	Items count:
	<input type="number" ng-model="itemCount" min="1" />
	</label>
	<label>
	Items width (px):
	<input type="number" ng-model="itemWidth" min="1" ng-change="updateStyleContainer()" />
	</label>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">

	<title>Ratio box · CodePen</title>
	<!--
	Copyright (c) 2012 Diablohu, http://codepen.io/Diablohu

	Permission is hereby granted, free of charge, to any person obtaining