Upgrade to Pro — share decks privately, control downloads, hide ads and more …

SourceKit-LSPをブラウザでコードを読むために活用する

 SourceKit-LSPをブラウザでコードを読むために活用する

SourceKit-LSPをブラウザでコードを読むために活用する
1. SourceKit for Safari Demo
2. SourceKit-LSPとは
3. LSP(Language Server Protocol)とは
4. SourceKit-LSPを使ってみる
5. SourceKit-LSPと通信する
6. Safari ExtensionとSourceKit-LSPを連携する
7. iPadでSourceKit-LSPを使う!?

w/ Presenter Note
https://www.icloud.com/keynote/0TuUNBtyBEnm5Mxqe0o7ROIRQ#iOSDC_-_SourceKit_LSP

Kishikawa Katsumi

September 19, 2020
Tweet

More Decks by Kishikawa Katsumi

Other Decks in Programming

Transcript

  1. Kishikawa Katsumi
    SourceKit-LSPΛϒϥ΢βͰ
    ίʔυΛಡΉͨΊʹ׆༻͢Δ

    View full-size slide

  2. ໨࣍
    1. SourceKit for Safari Demo

    2. SourceKit-LSPͱ͸

    3. LSPʢLanguage Server Protocolʣͱ͸

    4. SourceKit-LSPΛ࢖ͬͯΈΔ

    5. SourceKit-LSPͱ௨৴͢Δ

    6. Safari ExtensionͱSourceKit-LSPΛ࿈ܞ͢Δ

    7. iPadͰSourceKit-LSPΛ࢖͏ʂʁ

    View full-size slide

  3. SourceKit for Safari Demo

    View full-size slide

  4. SourceKit for Safari Demo
    Quick Help popup

    View full-size slide

  5. SourceKit for Safari Demo
    Quick Help popup

    View full-size slide

  6. SourceKit for Safari Demo
    Jumps to Definition

    View full-size slide

  7. SourceKit for Safari Demo
    Find References

    View full-size slide

  8. SourceKit for Safari Demo
    Highlights References

    View full-size slide

  9. GitHub Code Navigation
    https://docs.github.com/en/github/managing-files-in-a-repository/navigating-code-on-github

    View full-size slide

  10. SourceKit-LSPͱ͸

    View full-size slide

  11. SourceKit-LSPͱ͸
    SourceKit-LSP is an implementation of the Language Server
    Protocol (LSP) for Swift and C-based languages.

    It provides features like code-completion and jump-to-definition to
    editors that support LSP.

    SourceKit-LSP is built on top of sourcekitd and clangd for high-fidelity
    language support, and provides a powerful source code index as well
    as cross-language support.
    https://github.com/apple/sourcekit-lsp

    View full-size slide

  12. SourceKit-LSPͱ͸
    • SwiftɺCɺC++ɺObjective-C༻ͷLanguage Server Protocolͷ࣮૷

    • LSPʢLanguage Server ProtocolʣΛαϙʔτ͢ΔςΩετΤσΟλͰ

    ίʔυิ׬΍ఆٛݩʹδϟϯϓͳͲͷػೳ͕࢖͑ΔΑ͏ʹͳΔ

    • SourceKit-LSP͸sourcekitdͱclangdͱ࿈ܞͯͦ͠ΕΒͷػೳΛఏڙ͍ͯ͠Δ

    View full-size slide

  13. LSPʢLanguage Server Protocolʣͱ͸
    Adding features like auto complete, go to definition, or documentation on hover for a
    programming language takes significant effort. Traditionally this work had to be
    repeated for each development tool, as each tool provides different APIs for
    implementing the same feature.

    A Language Server is meant to provide the language-specific smarts and
    communicate with development tools over a protocol that enables inter-process
    communication.

    The idea behind the Language Server Protocol (LSP) is to standardize the protocol for
    how such servers and development tools communicate. This way, a single Language
    Server can be re-used in multiple development tools, which in turn can support
    multiple languages with minimal effort.
    https://microsoft.github.io/language-server-protocol/

    View full-size slide

  14. LSPʢLanguage Server Protocolʣͱ͸
    LSPʢLanguage Server Protocolʣ͸IDEͰඞཁͱ͞ΕΔιʔείʔυͷΦʔτ
    ίϯϓϦʔτ΍γϯϘϧͷఆٛݩʹδϟϯϓ͢ΔͳͲͷϓϩάϥϜΛղੳͯ͠
    ৘ใΛఏڙ͢ΔػೳΛαʔϏεͱ࣮ͯ͠ݱ͢Δ΋ͷͰ͢ɻ

    IDEͰඞཁͱ͞ΕΔػೳͱ͍͏΋ͷ͸ɺϓϩάϥϛϯάݴޠ͕มΘͬͯ΋΍Γͨ
    ͍͜ͱ͸΄΅ಉ͡Ͱ͢ɻLSP͕ొ৔͢ΔҎલ͸ݴޠ͝ͱͷIDE͕ͦΕͧΕ࣮૷͠
    ͯఏڙ͍ͯ͠·ͨ͠ɻ

    LSP͸ɺ͜ͷΑ͏ͳݴޠ͕มΘͬͯ΋ڞ௨ͯ͠ٻΊΒΕΔIDEͷػೳΛந৅Խ͠
    ͯ։ൃπʔϧ͔Β࢖͑ΔΑ͏ʹ͢Δ࢓༷Ͱ͢ɻ

    View full-size slide

  15. LSPʢLanguage Server Protocolʣͱ͸
    https://nshipster.com/language-server-protocol/

    View full-size slide

  16. SourceKit-LSPΛ࢖ͬͯΈΔ

    View full-size slide

  17. SourceKit-LSPΛ࢖ͬͯΈΔ
    1. SourceKit-LSPΛೖख͢Δ

    2. ςΩετΤσΟλͰSourceKit-LSPΛར༻͢ΔઃఆΛ͢Δ

    3. swift buildίϚϯυͰϓϩδΣΫτΛϏϧυ͢Δ

    4. ςΩετΤσΟλͰϓϩδΣΫτΛ։͘
    https://github.com/apple/sourcekit-lsp#getting-started

    View full-size slide

  18. SourceKit-LSPΛ࢖ͬͯΈΔ
    with VS Code
    1. SourceKit-LSP Visual Studio Code extensionΛϏϧυɾΠϯετʔϧ

    2. VS CodeʹSourceKit-LSPͷઃఆΛ͢Δ
    https://github.com/apple/sourcekit-lsp/tree/master/Editors#visual-studio-code

    View full-size slide

  19. SourceKit-LSPΛ࢖ͬͯΈΔ
    Visual Studio Code extensionΛϏϧυɾΠϯετʔϧ

    View full-size slide

  20. xcrun --find sourcekit-lsp

    View full-size slide

  21. SourceKit-LSPΛ࢖ͬͯΈΔ

    View full-size slide

  22. SourceKit-LSPΛ࢖ͬͯΈΔ

    View full-size slide

  23. SourceKit-LSPΛ࢖ͬͯΈΔ
    iOS SDKΛར༻͢ΔઃఆΛ௥Ճ

    View full-size slide

  24. SourceKit-LSPΛ࢖ͬͯΈΔ

    View full-size slide

  25. SourceKit-LSPͱ௨৴͢Δ

    View full-size slide

  26. SourceKit-LSPͱ௨৴͢Δ
    https://microsoft.github.io/language-server-protocol/overviews/lsp/overview/
    A language server runs as a separate process and development tools communicate with the server using the
    language protocol over JSON-RPC.

    View full-size slide

  27. SourceKit-LSPͱ௨৴͢Δ
    https://microsoft.github.io/language-server-protocol/overviews/lsp/overview/
    Request Response

    View full-size slide

  28. SourceKit-LSPͱ௨৴͢Δ
    https://microsoft.github.io/language-server-protocol/specifications/specification-current/
    Request Response
    Content-Length: ...\r\n
    \r\n
    {
    "jsonrpc": "2.0",
    "id": 1,
    "method": "textDocument/didOpen",
    "params": {
    ...
    }
    }
    Header
    Content

    View full-size slide

  29. SourceKit-LSPͱ௨৴͢Δ
    VS Code LSP
    initialize
    initialized
    didOpen
    hover
    hover
    didOpen
    hover

    View full-size slide

  30. SourceKit-LSPͱ௨৴͢Δ
    The protocol does not make any provisions about how requests,
    responses and notifications are transferred between client and server.

    https://en.wikipedia.org/wiki/Language_Server_Protocol#Transport_layer

    View full-size slide

  31. SourceKit-LSPͱ௨৴͢Δ
    The protocol does not make any provisions about how requests,
    responses and notifications are transferred between client and server.

    In this implementation, an editor communicates through stdin/stdout
    with the TypeScript server process and uses a JSON payload
    https://en.wikipedia.org/wiki/Language_Server_Protocol#Transport_layer
    https://docs.microsoft.com/en-us/visualstudio/extensibility/language-server-protocol?view=vs-2019#how-work-on-the-lsp-started

    View full-size slide

  32. SourceKit-LSPͱ௨৴͢Δ

    View full-size slide

  33. SourceKit-LSPͱ௨৴͢Δ

    View full-size slide

  34. SourceKit-LSPͱ௨৴͢Δ

    View full-size slide

  35. SourceKit-LSPͱ௨৴͢Δ

    View full-size slide

  36. SourceKit-LSPͱ௨৴͢Δ

    View full-size slide

  37. Symbols Hover

    View full-size slide

  38. https://github.com/kishikawakatsumi/SourceKitForSafari
    SourceKit-LSPͱ௨৴͢Δ

    View full-size slide

  39. https://github.com/kishikawakatsumi/SourceKitForSafari

    View full-size slide

  40. https://github.com/kishikawakatsumi/SourceKitForSafari
    SourceKit-LSPͱ௨৴͢Δ

    View full-size slide

  41. Safari Extensionͱ
    SourceKit-LSPΛ࿈ܞ͢Δ

    View full-size slide

  42. Safari ExtensionͱSourceKit-LSPΛ࿈ܞ͢Δ
    Safari Extension
    https://developer.apple.com/documentation/safariservices/safari_app_extensions

    View full-size slide

  43. Safari ExtensionͱSourceKit-LSPΛ࿈ܞ͢Δ
    Safari Extension

    View full-size slide

  44. Safari ExtensionͱSourceKit-LSPΛ࿈ܞ͢Δ
    Safari Extension
    SourceKit-LSP

    View full-size slide

  45. Chrome ExtensionͱSourceKit-LSPΛ࿈ܞ͢Δ
    Chrome Extension
    SourceKit-LSP Native Messaging

    View full-size slide

  46. Safari ExtensionͱSourceKit-LSPΛ࿈ܞ͢Δ
    App Side

    View full-size slide

  47. Safari ExtensionͱSourceKit-LSPΛ࿈ܞ͢Δ
    JS Side

    View full-size slide

  48. iPadͰSourceKit-LSPΛ࢖͏ʂʁ

    View full-size slide

  49. ·ͱΊ
    • SourceKit-LSPΛ࢖͏ͱXcode͕ఏڙ͍ͯ͠Δίʔυิ׬΍ϦϑΝΫλϦϯά
    ͷ৘ใΛऔಘͰ͖Δ

    • SourceKit-LSP͸ΫϥΠΞϯτϥΠϒϥϦ΋͋ΔͷͰ࿈ܞ͢Δ͜ͱ͸೉͘͠ͳ
    ͍

    • HTTPӽ͠ʹSourceKit-LSPΛૢ࡞͢ΔͱXcode for iOS͕࡞ΕΔ͔΋ʁ

    • SourceKit for SafariʢChrome֦ு΋͋Γ·͢ʣࢀߟʹ͍ͯͩ͘͠͞

    https://github.com/kishikawakatsumi/SourceKitForSafari

    View full-size slide