Vue.JS is a progressive JavaScript framework created by Evan You, formerly of Google. It was first released in 2014 and is growing in popularity as an alternative to AngularJS and React. Key features include declarative rendering, dependency tracking for automatic re-renders, and directives for DOM manipulation. Developers can get started by adding Vue to an HTML page or with single file components using tools like Webpack. The documentation provides many examples for building interfaces with directives, conditional rendering, forms, and more. While still smaller than communities for Angular and React, Vue has growing support from companies and an active ecosystem of libraries.
Vue JS is a progressive framework for building user interfaces. It uses a component-driven approach and features like reactivity and computed properties that make it possible to build desktop, mobile, and web applications. Some key features include reactive data binding, conditional rendering, mixins, slots for content distribution, and Vuex for global state management between components. Asynchronous and dynamic components add flexibility. Vue shares similarities with React in using virtual DOM and components but differs in file structure and size.
배민찬(https://www.baeminchan.com) 서비스의 백엔드 시스템 중 일부가 지난 1년간 어떤 고민과 아이디어, 결과물을 만들어냈는지 공유하려고 합니다. 발표 중 언급되는 용어나 도구에 대해 일반적인 정의나 간단한 설명은 언급되나 자세히 다루지 않습니다. 사용된 도구들로 어떻게 이벤트 기반 분산 시스템을 만들었는지에 대한 이야기가 중심입니다.
The document discusses spatial analysis and visualization using open source GIS and OGC standards. It provides examples of 1) a national land environment assessment map service, 2) an integrated epidemiological investigation analysis system, and 3) a Web Processing Service demo. It also discusses descriptive statistics, spatial pattern analysis, spatial interpolation, vector and raster geoprocessing tools, and setting up a GeoServer and PostGIS system to support WMS, WFS, and WPS services.
마이크로서비스 스타일로 만들어진 시스템을 모노리틱 스타일로 이관한 사례와 함께 스프링을 이용해 모듈형 모노리스(modular monoliths)를 만든 경험을 바탕으로 모노리틱/마이크로서비스 보다 본질적인 문제를 제기하고, 문제 해결을 위한 아이디어와 코드를 공유합니다.
https://github.com/arawn/building-modular-monoliths-using-spring
이 자료는 2019년 KSUG 세미나에서 진행한 "잘 키운 모노리스 하나 열 마이크로서비스 안 부럽다"를 기반으로 몇가지 내용을 추가하고, 전개 방식을 다듬어 조금 더 친절하게 만들어졌습니다.
This document discusses strategies for modernizing a legacy monolithic application, including using strangler patterns to gradually refactor the monolith into microservices. It outlines approaches like using an API gateway to front the legacy system and new services, as well as methodologies like twelve-factor apps. Key techniques mentioned include feature toggles and service discovery with Eureka.
The document discusses reinforcement learning and its application to training an AI agent to play Super Mario Bros. It begins by explaining how animals and humans learn through reinforcement and punishment in their environments based on the rewards and consequences of their actions. It then provides an overview of reinforcement learning, including key concepts like the Markov decision process, exploration versus exploitation, and using a replay memory buffer to train a deep learning model. It concludes by describing how the Super Mario Bros environment can be set up and used with a reinforcement learning agent, including defining the state and action spaces, rewards and penalties, and the process of minimizing the loss to optimize the agent's behavior.
popular FULL stacks and full reference of an MEAN stack with real time applications and more.MEAN stack is mainly for single page web applications and have an professional dynamic web page.
This document provides an introduction and overview of Node.js, including what Node.js is, its architecture and basics, how to write "Hello World" programs in Node.js and Express, how to use modules, errors, middleware, routers, Mongoose and MongoDB for databases, and the MEAN stack. It also describes a tutorial for building a backend API with Node.js, Express, Mongoose and MongoDB.
오딘: 발할라 라이징 MMORPG의 성능 최적화 사례 공유 [카카오게임즈 - 레벨 300] - 발표자: 김문권, 팀장, 라이온하트 스튜디오...Amazon Web Services Korea
서비스 런칭을 위해 라이온하트와 카카오게임즈가 어떻게 최적 성능의 인스턴스를 선택하고, Windows 운영 체제를 최적화하며, 왜 Amazon Aurora를 기본 데이터베이스로 채택하였는지를 설명합니다. 또한, 출시부터 운영까지의 과정에서 MMORPG가 어떻게 AWS 상에서 설계되고, 게임 서버 성능을 극대할 수 있었는지에 대해 전달해드립니다.
HTML5에는 CSS3D, Canvas, WebGL등의 전통적인 웹 개발의 영역을 넘어서는 그래픽 API들이 추가되었다.
웹 개발자들에게 생소할 수 있는 있는 이런 API들의 원리와 개발상의 팁들을 공유하고 현재의 현황과 어떻게 발전시킬 수 있을지 함께 이야기해보고자 한다.
The document discusses various machine learning clustering algorithms like K-means clustering, DBSCAN, and EM clustering. It also discusses neural network architectures like LSTM, bi-LSTM, and convolutional neural networks. Finally, it presents results from evaluating different chatbot models on various metrics like validation score.
The document discusses challenges with using reinforcement learning for robotics. While simulations allow fast training of agents, there is often a "reality gap" when transferring learning to real robots. Other approaches like imitation learning and self-supervised learning can be safer alternatives that don't require trial-and-error. To better apply reinforcement learning, robots may need model-based approaches that learn forward models of the world, as well as techniques like active localization that allow robots to gather targeted information through interactive perception. Closing the reality gap will require finding ways to better match simulations to reality or allow robots to learn from real-world experiences.
[243] Deep Learning to help student’s Deep LearningNAVER D2
This document describes research on using deep learning to predict student performance in massive open online courses (MOOCs). It introduces GritNet, a model that takes raw student activity data as input and predicts outcomes like course graduation without feature engineering. GritNet outperforms baselines by more than 5% in predicting graduation. The document also describes how GritNet can be adapted in an unsupervised way to new courses using pseudo-labels, improving predictions in the first few weeks. Overall, GritNet is presented as the state-of-the-art for student prediction and can be transferred across courses without labels.
[234]Fast & Accurate Data Annotation Pipeline for AI applicationsNAVER D2
This document provides a summary of new datasets and papers related to computer vision tasks including object detection, image matting, person pose estimation, pedestrian detection, and person instance segmentation. A total of 8 papers and their associated datasets are listed with brief descriptions of the core contributions or techniques developed in each.
[226]NAVER 광고 deep click prediction: 모델링부터 서빙까지NAVER D2
This document presents a formula for calculating the loss function J(θ) in machine learning models. The formula averages the negative log likelihood of the predicted probabilities being correct over all samples S, and includes a regularization term λ that penalizes predicted embeddings being dissimilar from actual embeddings. It also defines the cosine similarity term used in the regularization.
[214] Ai Serving Platform: 하루 수 억 건의 인퍼런스를 처리하기 위한 고군분투기NAVER D2
The document discusses running a TensorFlow Serving (TFS) container using Docker. It shows commands to:
1. Pull the TFS Docker image from a repository
2. Define a script to configure and run the TFS container, specifying the model path, name, and port mapping
3. Run the script to start the TFS container exposing port 13377
The document discusses linear algebra concepts including:
- Representing a system of linear equations as a matrix equation Ax = b where A is a coefficient matrix, x is a vector of unknowns, and b is a vector of constants.
- Solving for the vector x that satisfies the matrix equation using linear algebra techniques such as row reduction.
- Examples of matrix equations and their component vectors are shown.
This document describes the steps to convert a TensorFlow model to a TensorRT engine for inference. It includes steps to parse the model, optimize it, generate a runtime engine, serialize and deserialize the engine, as well as perform inference using the engine. It also provides code snippets for a PReLU plugin implementation in C++.
The document discusses machine reading comprehension (MRC) techniques for question answering (QA) systems, comparing search-based and natural language processing (NLP)-based approaches. It covers key milestones in the development of extractive QA models using NLP, from early sentence-level models to current state-of-the-art techniques like cross-attention, self-attention, and transfer learning. It notes the speed and scalability benefits of combining search and reading methods for QA.
3. 목차 (http://bit.ly/deview_canvas)
● Canvas의 역사
● 브라우저는 어떻게 그림을 그리나?
● Canvas는 어떻게 그림을 그리나?
● Canvas Animation의 문제점
● 기존의 Canvas Animation 개선안들
● 새로운 API의 도입 OffscreenCanvas
● How to use Offscreen Canvas
● 사례 연구 및 그 밖의 실험
5. WebCore/html/HTMLCanvasElement.h
/*
* Copyright (C) 2004-2017 Apple Inc. All rights reserved.
* Copyright (C) 2007 Alp Toker <alp@atoker.com>
* Copyright (C) 2010 Torch Mobile (Beijing) Co. Ltd. All rights reserved.
*
* ...
*
*/
19. Rendering Engine에 의해 그리는 방법 결정
LayoutCanvas
Root
PaintLayer
PaintLayer
LayoutBlock
LayoutBlock
LayoutButton
Rendering
Engine
20. Rendering Engine에 의해 그리는 방법 결정
LayoutCanvas
Root
PaintLayer
PaintLayer
LayoutBlock
LayoutBlock
LayoutButton
Rendering
Engine
중요한 것은 어떤 모양으로,
어느 위치에 어느정도 크기로,
어떤 순서로 그릴지를 결정
21. Rendering Engine에 의해 그리는 방법 결정
Root
PaintLayer
LayoutBlock
LayoutBlock
LayoutButton
Graphics
Library
Hello
drawRoundRect();
drawText();
어떻게 그림을 그릴지에 대한 정보가 담겨있다
22. 여기서 중요한 것은 Rendering Engine이
<button></button>을 어떻게 그릴지를 알고있다
53. 참고1: “Accelerated compositing in WebKit: Now and in the future”, 데뷰 2015, 황광윤
- https://deview.kr/2015/schedule#session/75
참고2: “WebKit의 GPU 렌더링”, 데뷰 2012, 황동성
- https://deview.kr/2012/xe/index.php?mid=track&document_srl=374&time_srl=265
참고3: “웹 성능 최적화에 필요한 브라우저의 모든 것”, 데뷰 2018, 이형욱
- https://deview.kr/2018/schedule/252
73. OffscreenCanvas란?
● Canvas Rendering을 DOM과는 별개로 Worker thread에서 수행할 수 있도록
해주는 새로운 API
● 기존의 Canvas Rendering Logic은 고치지 않고 thread만 옮겨가서 그대로
수행할 수 있도록 고안
● Chrome 69 Stable에 이미 Shipping
74. 16.7 ms16.7 ms
Main thread
Javascript
Overhead
Skia
Overhead
DOM
Overhead
GPU Process
Raster
Raster Raster
Raster
Raster Raster
다시 참혹한 현실..
75. 16.7 ms16.7 ms
Main thread Javascript
DOM
Rendering
Worker thread
Canvas
Javascript
Skia
Canvas
Javascript
Skia
Skia
OffscreenCanvas를 도입하면..
76. 16.7 ms16.7 ms
Main thread Javascript
DOM
Rendering
Worker thread
Canvas
Javascript
Skia
Canvas
Javascript
Skia
Skia
GPU Process
Raster
Raster Raster
Raster
Raster Raster
OffscreenCanvas를 도입하면..
92. The aim of the project is to create an easy to use,
lightweight, 3D library. The library provides Canvas 2D, SVG,
CSS3D and WebGL renderers.
93. 일반적인 Three.js의 Renderer 생성
const renderer = new THREE.WebGLRenderer();
renderer.render(scene, camera);
94. Three.js에서 OffscreenCanvas 사용
const offscreen = canvas.transferControlToOffscreen();
const renderer = new THREE.WebGLRenderer({
canvas: offscreen
});
renderer.render(scene, camera);
95. 일반적인 Three.js의 Texture 생성
// TextureLoader has a DOM dependency (HTMLImageElement)
const t = new THREE.TextureLoader().load('textures/crate.gif');
96. OffscreenCanvas를 사용할 때 Texture 생성
const loader = new THREE.ImageBitmapLoader();
loader.load( '../../textures/crate.gif', imageBitmap => {
const texture = new THREE.CanvasTexture(imageBitmap);
}, ...);