Skip to content

Extract Text from WASM page into Translation File #824

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
May 28, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
87 changes: 87 additions & 0 deletions locales/en-US/wasm.ftl
Original file line number Diff line number Diff line change
@@ -0,0 +1,87 @@
### Translation file for https://www.rust-lang.org/what/wasm

## Web-Assembly (templates/what/wasm.hbs)

wasm-page-title = Web­Assembly


## Why Rust? (templates/components/what/wasm/pitch.hbs)

wasm-why-rust-heading = Why Rust?

wasm-why-rust-predictable-alt = Gears
wasm-why-rust-predictable-heading = Predictable performance
wasm-why-rust-predictable-description =
No unpredictable garbage collection pauses. No JIT compiler performance cliffs. Just low-level control coupled with high-level ergonomics.

wasm-why-rust-small-code-alt = A microscope
wasm-why-rust-small-code-heading = Small code size
wasm-why-rust-small-code-description =
Small code size means faster page loads. Rust-generated <code>.wasm</code> doesn’t include extra bloat, like a garbage collector. Advanced optimizations and tree shaking remove dead code.

wasm-why-rust-amenities-alt = Luggage
wasm-why-rust-amenities-heading = Modern amenities
wasm-why-rust-amenities-description =
A lively ecosystem of libraries to help you hit the ground running. Expressive, zero-cost abstractions. And a welcoming community to help you learn.


## Get started! (templates/components/what/wasm/get-started.hbs)

wasm-get-started-heading = Get started!

wasm-get-started-wasm-alt = WebAssembly Logo
wasm-get-started-wasm-description =
Learn more about the fast, safe, and open virtual machine called WebAssembly, and read its standard.
wasm-get-started-wasm-link = Learn More

wasm-get-started-book-alt = wasm ferris
wasm-get-started-book-description =
Learn how to build, debug, profile, and deploy WebAssembly applications using Rust!
wasm-get-started-book-link = Read The Book

wasm-get-started-mdn-alt = MDN logo
wasm-get-started-mdn-description =
Learn more about WebAssembly on the Mozilla Developer Network.
wasm-get-started-mdn-link = Check it out


## Plays well with JavaScript (templates/components/what/wasm/js.hbs)

wasm-js-heading = Plays well with JavaScript

wasm-js-augment-heading = Augment, don’t replace
wasm-js-augment-description =
The dream of WebAssembly is not to kill JavaScript but to work alongside of it, to help super charge processing-heavy or low-level tasks &mdash; tasks that benefit from Rust’s focus on performance.

wasm-js-toolchains-heading = Works with familiar toolchains
wasm-js-toolchains-description =
Publish Rust WebAssembly packages to package registries like npm. Bundle and ship them with webpack, Parcel, and others. Maintain them with tools like <code>npm audit</code> and Greenkeeper.

wasm-js-interop-heading = Seamless interop
wasm-js-interop-description =
Automatically generate binding code between Rust, WebAssembly, and JavaScript APIs. Take advantage of libraries like <a href="https://rustwasm.github.io/wasm-bindgen/web-sys/index.html"><code>web-sys</code></a> that provide pre-packaged bindings for the entire web platform.


## Production use (templates/components/what/wasm/production.hbs)

wasm-production-heading = Production use

wasm-production-cloudflare-alt = cloudflare logo
wasm-production-cloudflare-quote =
We can compile Rust to WASM, and call it from Serverless functions woven into the very fabric of the Internet. That’s huge and I can’t wait to do more of it.
wasm-production-cloudflare-attribution =
&ndash; Steven Pack, <a href="{ $href }">Serverless Rust with Cloudflare Workers</a>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In the other pages the dash is not in the translation string


wasm-production-mozilla-alt = firefox
# If an opening square bracket is the first character on a line, it must be escaped like this: {"["}. See https://projectfluent.org/fluent/guide/special.html
wasm-production-mozilla-quote =
The JavaScript implementation [of the <code>source-map</code> library] has accumulated convoluted code in the name of performance, and we replaced it with idiomatic Rust. Rust does not force us to choose between clearly expressing intent and runtime performance.
wasm-production-mozilla-attribution =
&ndash; Nick Fitzgerald, <a href="{ $href }">Oxidizing Source Maps with Rust and WebAssembly</a>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We don't really need the hrefs here, but i guess it doesn't hurt. I should do this to the others.


wasm-production-dropbox-alt = dropbox
# If an opening square bracket is the first character on a line, it must be escaped like this: {"["}. See https://projectfluent.org/fluent/guide/special.html
wasm-production-dropbox-quote =
{"["}Rust’s] properties make it easy to embed the DivANS codec in a webpage with WASM, as shown above.
wasm-production-dropbox-attribution =
&ndash; Daniel Reiter Horn and Jongmin Baek, <a href="{ $href }">Building Better Compression Together with DivANS</a>
22 changes: 10 additions & 12 deletions templates/components/what/wasm/get-started.hbs
Original file line number Diff line number Diff line change
@@ -1,46 +1,44 @@
<section id="wasm-get-started" class="white">
<div class="w-100 mw-none ph3 mw8-m mw9-l center f3">
<header>
<h2>Get started!</h2>
<h2>{{text wasm-get-started-heading}}</h2>
<div class="highlight"></div>
</header>
<div class="flex flex-column flex-row-l pv4 pv0-l">
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
<div class="v-top tc-l">
<img src="/static/images/webassembly-logo.svg" alt="WebAssembly Logo"
<img src="/static/images/webassembly-logo.svg" alt="{{text wasm-get-started-wasm-alt}}"
class="mw3 mw4-ns"/>
</div>
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
<p class="flex-grow-1">
Learn more about the fast, safe, and open virtual machine called
WebAssembly, and read its standard.
{{text wasm-get-started-wasm-description}}
</p>
<a href="https://webassembly.org/" class="button button-secondary">Learn More</a>
<a href="https://webassembly.org/" class="button button-secondary">{{text wasm-get-started-wasm-link}}</a>
</div>
</div>
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
<div class="v-top tc-l">
<img src="/static/images/wasm-ferris.png" alt="wasm ferris"
<img src="/static/images/wasm-ferris.png" alt="{{text wasm-get-started-book-alt}}"
class="mw3 mw4-ns"/>
</div>
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
<p class="flex-grow-1">
Learn how to build, debug, profile, and deploy WebAssembly
applications using Rust!
{{text wasm-get-started-book-description}}
</p>
<a href="https://rustwasm.github.io/book" class="button button-secondary">Read The Book</a>
<a href="https://rustwasm.github.io/book" class="button button-secondary">{{text wasm-get-started-book-link}}</a>
</div>
</div>
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
<div class="v-top tc-l">
<img src="/static/images/mdn-logo.svg" alt="MDN logo"
<img src="/static/images/mdn-logo.svg" alt="{{text wasm-get-started-mdn-alt}}"
class="mw3 mw4-ns"/>
</div>
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
<p class="flex-grow-1">
Learn more about WebAssembly on the Mozilla Developer Network.
{{text wasm-get-started-mdn-description}}
</p>
<a href="https://developer.mozilla.org/en-US/docs/WebAssembly" class="button button-secondary">Check it out</a>
<a href="https://developer.mozilla.org/en-US/docs/WebAssembly" class="button button-secondary">{{text wasm-get-started-mdn-link}}</a>
</div>
</div>
</div>
Expand Down
22 changes: 7 additions & 15 deletions templates/components/what/wasm/js.hbs
Original file line number Diff line number Diff line change
@@ -1,34 +1,26 @@
<section id="wasm-plays-well-with-javascript" class="red">
<div class="w-100 mw-none ph3 mw8-m mw9-l center f3">
<header>
<h2>Plays well with JavaScript</h2>
<h2>{{text wasm-js-heading}}</h2>
<div class="highlight"></div>
</header>
<div class="flex flex-column flex-row-l pv4 pv0-l">
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
<h3 class="tc-l">Augment, don’t replace</h3>
<h3 class="tc-l">{{text wasm-js-augment-heading}}</h3>
<p class="flex-grow-1">
The dream of WebAssembly is not to kill JavaScript but to work
alongside of it, to help super charge processing-heavy or low-level
tasks &mdash; tasks that benefit from Rust’s focus on performance.
{{text wasm-js-augment-description}}
</p>
</div>
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
<h3 class="tc-l">Works with familiar toolchains</h3>
<h3 class="tc-l">{{text wasm-js-toolchains-heading}}</h3>
<p class="flex-grow-1">

Publish Rust WebAssembly packages to package registries like npm.
Bundle and ship them with webpack, Parcel, and others.
Maintain them with tools like <code>npm audit</code> and Greenkeeper.
{{text wasm-js-toolchains-description}}
</p>
</div>
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
<h3 class="tc-l">Seamless interop</h3>
<h3 class="tc-l">{{text wasm-js-interop-heading}}</h3>
<p class="flex-grow-1">
Automatically generate binding code between Rust, WebAssembly, and JavaScript APIs.
Take advantage of libraries like <a href="https://rustwasm.github.io/wasm-bindgen/web-sys/index.html"><code>web-sys</code></a>
that
provide pre-packaged bindings for the entire web platform.
{{text wasm-js-interop-description}}
</p>
</div>
</div>
Expand Down
26 changes: 10 additions & 16 deletions templates/components/what/wasm/pitch.hbs
Original file line number Diff line number Diff line change
@@ -1,49 +1,43 @@
<section id="wasm-why" class="purple">
<div class="w-100 mw-none ph3 mw8-m mw9-l center f3">
<header>
<h2>Why Rust?</h2>
<h2>{{text wasm-why-rust-heading}}</h2>
<div class="highlight"></div>
</header>
<div class="flex flex-column flex-row-l pv4 pv0-l">
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
<div class="v-top tc-l">
<img src="/static/images/gears.svg" alt="Gears"
<img src="/static/images/gears.svg" alt="{{text wasm-why-rust-predictable-alt}}"
class="mw3 mw4-ns" />
</div>
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
<h3 class="tc-l">Predictable performance</h3>
<h3 class="tc-l">{{text wasm-why-rust-predictable-heading}}</h3>
<p class="flex-grow-1">
No unpredictable garbage collection pauses. No JIT compiler
performance cliffs. Just low-level control coupled with high-level
ergonomics.
{{text wasm-why-rust-predictable-description}}
</p>
</div>
</div>
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
<div class="v-top tc-l">
<img src="/static/images/microscope.svg" alt="A microscope"
<img src="/static/images/microscope.svg" alt="{{text wasm-why-rust-small-code-alt}}"
class="mw3 mw4-ns" />
</div>
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
<h3 class="tc-l">Small code size</h3>
<h3 class="tc-l">{{text wasm-why-rust-small-code-heading}}</h3>
<p class="flex-grow-1">
Small code size means faster page loads. Rust-generated
<code>.wasm</code> doesn’t include extra bloat, like a garbage
collector. Advanced optimizations and tree shaking remove dead code.
{{text wasm-why-rust-small-code-description}}
</p>
</div>
</div>
<div class="flex flex-row flex-column-l justify-between-l mw8 measure-wide-l w-100 mt5 mt2-l">
<div class="v-top tc-l">
<img src="/static/images/luggage.svg" alt="Luggage"
<img src="/static/images/luggage.svg" alt="{{text wasm-why-rust-amenities-alt}}"
class="mw3 mw4-ns"/>
</div>
<div class="v-top pl4 pl0-l pt0 pt3-l measure-wide-l flex-l flex-column-l flex-auto-l justify-between-l pl4-l">
<h3 class="tc-l">Modern amenities</h3>
<h3 class="tc-l">{{text wasm-why-rust-amenities-heading}}</h3>
<p class="flex-grow-1">
A lively ecosystem of libraries to help you hit the
ground running. Expressive, zero-cost abstractions.
And a welcoming community to help you learn.
{{text wasm-why-rust-amenities-description}}
</p>
</div>
</div>
Expand Down
46 changes: 22 additions & 24 deletions templates/components/what/wasm/production.hbs
Original file line number Diff line number Diff line change
@@ -1,62 +1,60 @@
<section id="production" class="white">
<div class="w-100 mw-none ph3 mw8-m mw9-l center f3">
<header>
<h2>Production use</h2>
<h2>{{text wasm-production-heading}}</h2>
<div class="highlight"></div>
</header>
<div class="testimonials">
<div class="testimonial flex flex-row">
<div class="w-30-l tc pa5">
<img src="/static/images/user-logos/cloudflare.svg" alt="cloudflare logo" />
<img src="/static/images/user-logos/cloudflare.svg" alt="{{text wasm-production-cloudflare-alt}}" />
</div>
<div class="w-70-l">
<blockquote>
We can compile Rust to WASM, and call it from Serverless functions woven into the very fabric of the Internet. That’s huge and I can’t wait to do more of it.
{{text wasm-production-cloudflare-quote}}
</blockquote>
<p class="attribution">
&ndash; Steven Pack,
<a href="https://blog.cloudflare.com/cloudflare-workers-as-a-serverless-rust-platform/">
Serverless Rust with Cloudflare Workers
</a>

{{#text wasm-production-cloudflare-attribution}}
{{#textparam href}}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This can just be {{text wasm-production-cloudflare-attribution href="https://..."}}, textparam is for more complex stuff

https://blog.cloudflare.com/cloudflare-workers-as-a-serverless-rust-platform/
{{/textparam}}
{{/text}}
</p>
</div>
</div>
<div class="testimonial flex flex-row">
<div class="w-70-l">
<blockquote>
The JavaScript implementation [of the <code>source-map</code> library]
has accumulated convoluted code in the name of performance, and we
replaced it with idiomatic Rust. Rust does not force us to choose
between clearly expressing intent and runtime performance.
{{text wasm-production-mozilla-quote}}
</blockquote>
<p class="attribution">
&ndash; Nick Fitzgerald,
<a href="https://hacks.mozilla.org/2018/01/oxidizing-source-maps-with-rust-and-webassembly/">
Oxidizing Source Maps with Rust and WebAssembly
</a>
{{#text wasm-production-mozilla-attribution}}
{{#textparam href}}
https://hacks.mozilla.org/2018/01/oxidizing-source-maps-with-rust-and-webassembly/
{{/textparam}}
{{/text}}
</p>
</div>
<div class="w-30-l tc pa3">
<a href="https://hacks.mozilla.org/2018/01/oxidizing-source-maps-with-rust-and-webassembly/" class="db">
<img src="/static/images/firefox.png" alt="firefox" />
<img src="/static/images/firefox.png" alt="{{text wasm-production-mozilla-alt}}" />
</a>
</div>
</div>
<div class="testimonial flex flex-row">
<div class="w-30-l tc pa5">
<img src="/static/images/dropbox.svg" alt="dropbox" />
<img src="/static/images/dropbox.svg" alt="{{text wasm-production-dropbox-alt}}" />
</div>
<div class="w-70-l">
<blockquote>
[Rust’s] properties make it easy to embed the DivANS codec in a
webpage with WASM, as shown above.
{{text wasm-production-dropbox-quote}}
</blockquote>
<p class="attribution">
&ndash; Daniel Reiter Horn and Jongmin Baek,
<a href="https://blogs.dropbox.com/tech/2018/06/building-better-compression-together-with-divans/">
Building Better Compression Together with DivANS
</a>
{{#text wasm-production-dropbox-attribution}}
{{#textparam href}}
https://blogs.dropbox.com/tech/2018/06/building-better-compression-together-with-divans/
{{/textparam}}
{{/text}}
</p>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion templates/what/wasm.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

<header class="mt3 mt2-ns mb4 mb5-ns tc tl-ns">
<div class="w-100 mw-none ph3 mw8-m mw9-l center f3">
<h1>Web&shy;Assembly</h1>
<h1>{{text wasm-page-title}}</h1>
</div>
</header>

Expand Down