SlideShare ist ein Scribd-Unternehmen logo
1 von 15
Downloaden Sie, um offline zu lesen
ПишемПишем нана ScalaScala длядля
браузерабраузера
Gleb Kanterov
gleb@kanterov.ru
ScalaJSScalaJS
JavaScriptJavaScript ScalaJSScalaJS
> ["10", "10", "10", "10"]
> .map(parseInt)
[10, NaN, 2, 3]
> List("10", "10", "10", "10")
> .map(parseInt)
List(10, 10, 10, 10)
scala-js-domscala-js-dom
def main(div: html.Div) = {
val child = dom.document
.createElement("div")
child.textContent =
"Hi from Scala-js-dom"
div.appendChild(child)
}
scalacssscalacss
val myStyle = style(
margin(12 px, auto),
&.hover(
cursor.zoomIn
),
&(media.not.handheld.landscape.maxWidth(640 px))(
width(400 px)
)
)
val button = style(
addClassNames("btn", "btn-default"),
textAlign.center
)
autowireautowire
trait Api {
def order(itemIds: List[Int]): Order
def submit(order: Order): Unit
}
val client = Ajax[Api]
val z: Future[Unit] = for {
order <- client.order(itemIds).call()
result <- client.submit(order).call()
} yield result
scala-asyncscala-async
val z: Future[Unit] = async {
val order = await(client.order(itemIds).call())
val result = await(client.submit(order).call())
result
}
scala-js-reactscala-js-react
@scalax
def render(self: This) = {
val todo = self.state.todos.count(!_.completed)
<section id="todoapp">
<header id="header">
<h1>todos</h1>
<input id="new-todo"
onChange={self.onChange}
onKeyUp={self.onKeyPress}
value={self.state.text}
placeholder="What needs to be done?"
autofocus={true}></input>
</header>
</section>
}
scodecscodec
case class Person(name: String, title: String)
object Person {
implicit val codec = Codec[Person]
}
sealed trait Tree
case class Node(l: Tree, r: Tree) extends Tree
case class Leaf(n: Int) extends Tree
object Tree {
implicit lazy val codec: Codec[Tree] = {
discriminated[Tree]
.by(uint8)
.typecase2(0, int32.as[Leaf])
.typecase2(1, lazily { (codec :: codec).as[Node] })
}
}
scalacheckscalacheck
property("reverse") = Prop.forAll { l: List[String] =>
l.reverse.reverse == l
}
property("fib") = Prop.forAll { i suchThat (_ > 2) =>
fib(i) ?= fib(i - 1) + fib(i - 2)
}
ИИ другиедругие
scalaz
scalaz-stream, scala.rx, monifu
shapeless
parboiled2
papa carlo
banana-rdf
scalajs-jquery
scalajs-angular
utest, minitest
АА такжетакже
поддержка IDE
инкрементальная компиляция
source maps
Google Closure Compiler
размеры JS
минимум - 100 Кб
TODO MVC - 250 Кб (64 Kb gzip) + react
максимум - 1Mb
ЗаключениеЗаключение
Можно скомпилировать Scala в JS
Scala код можно звать из JS, и наоборот
Производительность сопоставима с JS
Есть много библиотек
Можно все написать на ScalaJS :)
Есть альтернативы, см. Haskell, Erlang, Clojure
КонецКонец
https://twitter.com/kanterov
https://scala-js.org
https://github.com/scala-js/scala-js
https://github.com/scala-js/scala-js-dom
https://github.com/japgolly/scalacss
https://github.com/lihaoyi/autowire
https://github.com/kanterov/scala-js-react

Weitere ähnliche Inhalte

Andere mochten auch

Cовременный контроль качества: давай сделаем это по-быстрому...
Cовременный контроль качества: давай сделаем это по-быстрому...Cовременный контроль качества: давай сделаем это по-быстрому...
Cовременный контроль качества: давай сделаем это по-быстрому...
Igor Khrol
 
Web driver история одной миграции
Web driver   история одной миграцииWeb driver   история одной миграции
Web driver история одной миграции
Igor Khrol
 
автоматизация Flex приложений с помощью selenium rc
автоматизация Flex приложений с помощью selenium rcавтоматизация Flex приложений с помощью selenium rc
автоматизация Flex приложений с помощью selenium rc
Igor Khrol
 
Типичные ошибки начинающих писать тесты на WebDriver
Типичные ошибки начинающих писать тесты на WebDriverТипичные ошибки начинающих писать тесты на WebDriver
Типичные ошибки начинающих писать тесты на WebDriver
Igor Khrol
 

Andere mochten auch (15)

Cовременный контроль качества: давай сделаем это по-быстрому...
Cовременный контроль качества: давай сделаем это по-быстрому...Cовременный контроль качества: давай сделаем это по-быстрому...
Cовременный контроль качества: давай сделаем это по-быстрому...
 
SeleniumCamp 2016
SeleniumCamp 2016SeleniumCamp 2016
SeleniumCamp 2016
 
Web driver история одной миграции
Web driver   история одной миграцииWeb driver   история одной миграции
Web driver история одной миграции
 
автоматизация Flex приложений с помощью selenium rc
автоматизация Flex приложений с помощью selenium rcавтоматизация Flex приложений с помощью selenium rc
автоматизация Flex приложений с помощью selenium rc
 
Повышаем надёжность тестов через JavaScript
Повышаем надёжность тестов через JavaScriptПовышаем надёжность тестов через JavaScript
Повышаем надёжность тестов через JavaScript
 
Agile Testing in Enterprise: Way to transform - SQA Days 2014
Agile Testing in Enterprise: Way to transform - SQA Days 2014Agile Testing in Enterprise: Way to transform - SQA Days 2014
Agile Testing in Enterprise: Way to transform - SQA Days 2014
 
Webium: Page Objects In Python (Eng)
Webium: Page Objects In Python (Eng)Webium: Page Objects In Python (Eng)
Webium: Page Objects In Python (Eng)
 
Автоматизация тестирования: доступна каждому или удел избранных?
Автоматизация тестирования: доступна каждому или удел избранных?Автоматизация тестирования: доступна каждому или удел избранных?
Автоматизация тестирования: доступна каждому или удел избранных?
 
Good test = simple test (with selenide)
Good test = simple test (with selenide)Good test = simple test (with selenide)
Good test = simple test (with selenide)
 
Qa Automation - отбрасываем лишнее и тестируем суть
Qa Automation - отбрасываем лишнее и тестируем сутьQa Automation - отбрасываем лишнее и тестируем суть
Qa Automation - отбрасываем лишнее и тестируем суть
 
Типичные ошибки начинающих писать тесты на WebDriver
Типичные ошибки начинающих писать тесты на WebDriverТипичные ошибки начинающих писать тесты на WebDriver
Типичные ошибки начинающих писать тесты на WebDriver
 
Концепция QaAPI: взгляд на тестирование с другой стороны баррикад
Концепция QaAPI: взгляд на тестирование с другой стороны баррикадКонцепция QaAPI: взгляд на тестирование с другой стороны баррикад
Концепция QaAPI: взгляд на тестирование с другой стороны баррикад
 
Автоматизация тестирования: отбрасываем лишнее и проверяем суть
Автоматизация тестирования: отбрасываем лишнее и проверяем сутьАвтоматизация тестирования: отбрасываем лишнее и проверяем суть
Автоматизация тестирования: отбрасываем лишнее и проверяем суть
 
Test Automation Wargaming SQA Days 17
Test Automation Wargaming SQA Days 17Test Automation Wargaming SQA Days 17
Test Automation Wargaming SQA Days 17
 
Webium: Page Objects in Python
Webium: Page Objects in PythonWebium: Page Objects in Python
Webium: Page Objects in Python
 

Ähnlich wie Write code for browsers with Scala

Вёрстка в стиле Ruby: HAML, SASS, Compass, CoffeeScript, Jammit
Вёрстка в стиле Ruby: HAML, SASS, Compass, CoffeeScript, JammitВёрстка в стиле Ruby: HAML, SASS, Compass, CoffeeScript, Jammit
Вёрстка в стиле Ruby: HAML, SASS, Compass, CoffeeScript, Jammit
Andrey Sitnik
 
Web осень 2012 лекция 10
Web осень 2012 лекция 10Web осень 2012 лекция 10
Web осень 2012 лекция 10
Technopark
 
Web весна 2013 лекция 10
Web весна 2013 лекция 10Web весна 2013 лекция 10
Web весна 2013 лекция 10
Technopark
 
Js templating stepan_reznikov
Js templating stepan_reznikovJs templating stepan_reznikov
Js templating stepan_reznikov
yaevents
 
всплывающее окно при закрытии сайта
всплывающее окно при закрытии сайта  всплывающее окно при закрытии сайта
всплывающее окно при закрытии сайта
Olga Pirozhenko
 
Web весна 2012 лекция 4
Web весна 2012 лекция 4Web весна 2012 лекция 4
Web весна 2012 лекция 4
Technopark
 
Кроссбраузерные решения в рекламной сети Яндекса
Кроссбраузерные решения в рекламной сети ЯндексаКроссбраузерные решения в рекламной сети Яндекса
Кроссбраузерные решения в рекламной сети Яндекса
Media Gorod
 
Артем Маркушев - HTML & CSS
Артем Маркушев - HTML & CSSАртем Маркушев - HTML & CSS
Артем Маркушев - HTML & CSS
DataArt
 
Web весна 2012 лекция 10
Web весна 2012 лекция 10Web весна 2012 лекция 10
Web весна 2012 лекция 10
Technopark
 
Knockout.JS на примере 2ГИС-Онлайн
Knockout.JS на примере 2ГИС-ОнлайнKnockout.JS на примере 2ГИС-Онлайн
Knockout.JS на примере 2ГИС-Онлайн
DevDay
 
Андрей Тюпа Оптимизация верстки Sass + Compass framework
Андрей Тюпа Оптимизация верстки Sass + Compass frameworkАндрей Тюпа Оптимизация верстки Sass + Compass framework
Андрей Тюпа Оптимизация верстки Sass + Compass framework
Albina Tiupa
 
Knockoutjs на примере 2ГИС-Онлайн
Knockoutjs на примере 2ГИС-ОнлайнKnockoutjs на примере 2ГИС-Онлайн
Knockoutjs на примере 2ГИС-Онлайн
2ГИС Технологии
 

Ähnlich wie Write code for browsers with Scala (20)

Svg
SvgSvg
Svg
 
Вёрстка в стиле Ruby: HAML, SASS, Compass, CoffeeScript, Jammit
Вёрстка в стиле Ruby: HAML, SASS, Compass, CoffeeScript, JammitВёрстка в стиле Ruby: HAML, SASS, Compass, CoffeeScript, Jammit
Вёрстка в стиле Ruby: HAML, SASS, Compass, CoffeeScript, Jammit
 
Web осень 2012 лекция 10
Web осень 2012 лекция 10Web осень 2012 лекция 10
Web осень 2012 лекция 10
 
Web весна 2013 лекция 10
Web весна 2013 лекция 10Web весна 2013 лекция 10
Web весна 2013 лекция 10
 
Jsfwdays 2013-2
Jsfwdays 2013-2Jsfwdays 2013-2
Jsfwdays 2013-2
 
Как мы документируем программные интерфейсы. YaC 2014
Как мы документируем программные интерфейсы. YaC 2014Как мы документируем программные интерфейсы. YaC 2014
Как мы документируем программные интерфейсы. YaC 2014
 
Стажировка-2015. Разработка. Занятие 13. Сборка фронтенда
Стажировка-2015. Разработка. Занятие 13. Сборка фронтендаСтажировка-2015. Разработка. Занятие 13. Сборка фронтенда
Стажировка-2015. Разработка. Занятие 13. Сборка фронтенда
 
Scala for android
Scala for androidScala for android
Scala for android
 
Js templating stepan_reznikov
Js templating stepan_reznikovJs templating stepan_reznikov
Js templating stepan_reznikov
 
Степан Резников "Шаблонизация на клиенте"
Степан Резников "Шаблонизация на клиенте"Степан Резников "Шаблонизация на клиенте"
Степан Резников "Шаблонизация на клиенте"
 
всплывающее окно при закрытии сайта
всплывающее окно при закрытии сайта  всплывающее окно при закрытии сайта
всплывающее окно при закрытии сайта
 
Web весна 2012 лекция 4
Web весна 2012 лекция 4Web весна 2012 лекция 4
Web весна 2012 лекция 4
 
Canvas
CanvasCanvas
Canvas
 
Кроссбраузерные решения в рекламной сети Яндекса
Кроссбраузерные решения в рекламной сети ЯндексаКроссбраузерные решения в рекламной сети Яндекса
Кроссбраузерные решения в рекламной сети Яндекса
 
Артем Маркушев - HTML & CSS
Артем Маркушев - HTML & CSSАртем Маркушев - HTML & CSS
Артем Маркушев - HTML & CSS
 
Web весна 2012 лекция 10
Web весна 2012 лекция 10Web весна 2012 лекция 10
Web весна 2012 лекция 10
 
Alasql.js - SQL сервер на JavaScript
Alasql.js - SQL сервер на JavaScriptAlasql.js - SQL сервер на JavaScript
Alasql.js - SQL сервер на JavaScript
 
Knockout.JS на примере 2ГИС-Онлайн
Knockout.JS на примере 2ГИС-ОнлайнKnockout.JS на примере 2ГИС-Онлайн
Knockout.JS на примере 2ГИС-Онлайн
 
Андрей Тюпа Оптимизация верстки Sass + Compass framework
Андрей Тюпа Оптимизация верстки Sass + Compass frameworkАндрей Тюпа Оптимизация верстки Sass + Compass framework
Андрей Тюпа Оптимизация верстки Sass + Compass framework
 
Knockoutjs на примере 2ГИС-Онлайн
Knockoutjs на примере 2ГИС-ОнлайнKnockoutjs на примере 2ГИС-Онлайн
Knockoutjs на примере 2ГИС-Онлайн
 

Write code for browsers with Scala